How to Install and Use PostgreSQL on Dotnet

Hi,

I will try to explain how to install PostgreSql on windows pc and how to change available .net web api project database with PostgreSql. Firstly, let’s download and install PostgreSql. You can download it from here. Installation screens is as follows.

When you click finish button, second installation will start. Second installation is for administration tools. I skipped this step because I installed them before. But you should continue, because I used pgAdmin afterwards. It’s mean, you will see screenshots from pgAdmin. Anyway, let’s check the PostgreSQL. Click to start menu on windows and search pgAdmin from my computer. It’s browser based management panel for pgAdmin. pgAdmin screenshot is as follows.

Now, I will create a new database for my web api via pgAdmin. The screenshot is as follows.

After create a database, firstly I runned as follows command.

dotnet tool install –global dotnet-ef

I have already Entity Framework library in my project. Now, I will add a sub library. That version should be same with available Entity Framework. It’s as follows.

dotnet add package Microsoft.EntityFrameworkCore.Design

I need one more library for this example. I will include PostgreSQL to my project. This library is as follows.

dotnet add package Npgsql.EntityFrameworkCore.PostgreSQL –version 3.1.1

Before database migration and update, I should add new line on my DBContext file. New line will be on onConfiguring method.

optionsBuilder.UseNpgsql(@”Host=localhost;Port=5432;Username=postgres;Password=YourPassword;Database=YourDatabase“);

Now, Everything is ready for migration and update. You should run this command on your Data Access project.

dotnet ef migrations add example

The screenshot is as follows.

Let’s run last command and then database will be ready.

Let’s return pgAdmin and check tables. The screenshot is a follows.

Now, database and connection ready for use. Let’s run web api and check connection.

Example method;

Thanks.

How to Write .Net Core Web Api via MongoDB on Windows Computer

Hi,

I will try to explain “How to write .net core web api via MongoDB” in this post. Firstly, I should install MongoDB to my computer. Let’s get start. I used this link for download. Example screenshot is as follows.

After downloaded application, Let’s start to install it. The screenshots are as follows.

You can cancel MongoDB Compass. I didn’t install it.

After installation, I added new value in environment variables. This is for command prompt. I used mongoDB setup location in this step. My one is C:\Program Files\MongoDB\Server\4.2\bin If you want, you can skip this step.

I added two times. First one User variables for Your Username area and second one is system variables area. You should restart your computer after this step.
Let’s check MongoDB commands. I checked some commands. First command is;

mongo

show databases

use databaseName

db.CreateCollection(“ExampleCollection”)

db.DropDatabase()

That examples are enough for now. Maybe we can check all commands in another article. Now, let’s get start to web api.

I created and opened my project. After created project, I added mongoDB driver in my project. I used command for this as follows.

dotnet add package MongoDB.Driver –version 2.9.2

You can see this package in your .csproj file.

I started from model folder for development. Firstly, I created base model file. I added Id field because mongoDB is using Id field in collections. I created base model file for this. The screenshot is as follows.

After this file, I created an example model for my web api methods.

Now, I created a base repository for my models. I will use this with my model repository.

Example model repository is as follows.

I added connection string property in appconfig.json file. I will use this in startup.cs file.

Startup.cs is as follows.

Example methods are as follows.

Now, I can see my database on command prompt.

You can download my example project in this link.

Thanks.

How to do Hamburger Menu in React-Native (Android) Application

Hi,

I will try to explain “How to do Hamburger menu in React-Native? (Android)” in this post. Just android because, I couldn’t test on iOS application yet. I used windows computer in this application. Let’s get start to development.

I assume, you know “How to create a new project in react-native” I skipped this step. I use Visual Studio Code for my react-native applications. You can use this IDE or you can find alternatives. I will use screenshots from VS Code in this article. After create project, I created Pages folder for my screens. This folder is optional. You can use alternatives.(It’s mean different folder name) But I will create my all pages in this folder.

After create my example pages, I included some libraries in my project. You should run respectively as follow commands in command prompt.

npm install native-base –save
react-native link
npm install react-native-elements

After included this libraries, I created empty pages. (for hamburger menu items) My example page names are “HomePage.js, ProfilePage.js, SettingsPage.js, NotificationPage.js” Again, you can use different page names in here.

Empty Page Example

I shared my example page source code’s ın screenshots. You can find GitHub links end of this post. I didn’t add any component in this page. Just a page name for test.

In this step, I will include navigation library to my project. You should run this command in command prompt for this.

npm i react-navigation

After included react-navigation library, I cleared App.js file and I designed my navigation menu in this file. First step for design, I added my libraries and pages to App.js file.

Include libraries and pages

Finally, everything is ready for hamburger menu. Let’s start to design hamburger menu. If you know web programming you can think as html. It’s easy. Before share my design code block, let me explain to you my sections.

I added logo area for application and then text area for username or application name.

After then, I added DrawerItems tag for menu items. My pages will be show in via this items.

Finally, I added two icon for contact, information or etc. This icons are clickable and will be in bottom page.

I created assets folder in my root directory. If I don’t, application will give an error. After create assets folder, I copied no-image.png to this folder. I used this in hamburger menu. (Logo area) My designed codes are as follows.

Hamburger design codes.

I defined my pages when design finished. You can think Select – Option. I used this items in my design. My items screenshot as follows.

DrawerNavigator items.

If you want to add more item, you should insert more code block as follow.

Single item example.

After above step finished, I added code in bottom of App.js file as follow.

Menu finished. If I try to start my application after this step, I will see as follows error.

Error example

The solution is simple. Before I run my application (or after stopped via CTRL + C in command prompt) and then run this code in command prompt.

npm install –save react-native-gesture-handler
react-native link react-native-gesture-handler

After included and linked this package I can start application in virtual device. (Genymotion or etc.) I can see my hamburger menu like as follows.

Hamburger menu v1

Now, my menu ready for use but I will add icon for my items. It’s not required but It will be good with this icons. Before we added native-base library to current project. I used this library in this step. This code block should be over to Render method. This code block’s screenshot as follows. (static navigationOptions)

You can use https://ionicframework.com/docs/ionicons/ for menu icons. You should change name properties in above code. Finally, our project is as follows.

You can find project code in here.

Thanks.