How to Install and Use PostgreSQL on Dotnet


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.


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;


React-Native Example #1 Animated Question Screen


In this post, I created an example animated question page. I preferred react-native animatable library for animation. You can use this library or you can find alternative one. You can access updated example application from this link. I shared example project codes on github. You can check it end of this post.

What did I do in this post? I created a simple Question page and I integrated animation library. Questions are coming with animation and when user choose answer, next question is coming with same scenario. If questions finish or user chose wrong answer, result screen is coming with animation. I have a timer too. If times up, again result screen is coming with animation.

What did I use in this example?

React-Native 0.61.4

Expo 3.17.18

Visual Studio Code 1.41.1

I started from create a project step because, this post is first expo example in this blog. Let’s get start.

For create a new project, I used expo init “Project Name” on command prompt. After this command template list came, I chose blank template for my example project. The screenshot is as follows.

After template select, expo suggested to me yarn but I’m using npm. Because of this, I continued with npm.

After selecting the package manager, I waited like 2 mins for a create project. This time can be different for you because of your connection speed or etc. Project create result screenshot is as follows.

Now, my project is ready for development. Before I start, I installed an animation library. You can use as follows command for this and you can check animations from this link.

npm install react-native-animatable –save

After this step, I’m starting to develop my application via VS Code. You can use another alternatives. Firstly, I created Pages folder on root and Styles folder in available assets folder. I used this folders for my example. I didn’t explain a style codes. You can check or update from github links. Let’s start to question page.

I created QuestionPage.js in Pages folder. This example is Single Page application. Because of this, I will call my page from App.js file. The screenshot is as follows.

Before, I was using redux for state management but I used hooks in this example. My variable descriptions are as follows.

resultScreen: I triggered result screen via this variable.

answerAnimation: This variable for animation shape. I shared animation shapes in this post.

wrongAnswerStyle: When quiz start, all answers’ color is same. After user chose, I’m changing wrong answers color. Because user should see what’s correct or wrong. This variable is using for this.

trueAnswerStyle: This is like a wrongAnswerStyle. But this color for correct answer. You can cancel or change this variable.

timerVisible: After user choose an answer, I used timer area hidden with this variable. Because I didn’t show result screen after this. I showed to user correct/wrong answer 2 – 3 seconds.

controlAnswer: After user chose answer, I set users answer to this variable.

trueAnswer: When Question comes, I set true answer for current question in this variable. After user’s chose, I checked with controlAnswer/trueAnswer If this two are same, user gets +10 point and next question appears, If they are different, it goes to next question.

secondCounter: This is for timer.  For example; I did 90 seconds. You can change quiz time with this variable.

restartGame: If this variable is true, All other variables will be default value for new game.

clickableStatus: This is for waiting time. If user is looking correct/wrong answers, second answer can’t appear via this variable.

landingScreenProperty: After finished quiz, this variable will be true and user will see result screen.

nextQuestionSecond: This variable for show correct/wrong answers. I did 3 second for this.

I tried to explain variables in this step, you can change this variables or you can update all of them.

Next step for scenario. I tried to explain scenario with codes. First code part is as follows.

This code block is working after user’s choose. Firstly, I changed ClickableStatus because I don’t want a second answer for same question. I did disabled property true for TouchableHightlight

Now, I can check answer. User can’t check another one. If user’s answer is correct, I changed selected answer’s background color and I gave 3 second for waiting before next question. You can change this color. After all of this process, I showed 2 second loading screen before next question. If user’s answer is wrong, I changed all of answers background color. Correct one is green, others are red. After this, I hidden timer and 3 seconds later I showed result screen.

Before I said, If answer is correct, loading screen is coming. I decided that with this code block. If answer is correct, landingScreenProperty will be true and this code block triggered.

Firstly, I updated controlAnswer with default and changed timer value with 0 in this block. Before I decided nextQuestionSecond 3. After 3 second, everything changed with default and everything ready for new question. You can show points or etc. in this 3 second.

This screenshot is last screenshot for methods. I prepared first if case for timer. If resultscreen didn’t show and user didn’t answer yet, this timer triggered.

Second if case for restart game. If user click restart button, this block triggered to restart game.

I showed methods to you. Now, let’s check screens. First screen is Question screen. The screenshot is as follows.

I used view and animated.view in this screen. Animated. came from my library. If you used different or if you didn’t include this library, this won’t come on your project. You can see how can you add this library in your project.

The next screen is result page. The screenshot is as follows.

I added a button on result screen. I didn’t write score but if you want you can add quickly. If user click this button, restartGame value will be true and application will be restart.

The final screen is loading (or landing) screen. I just added static text on this screen. The screenshot is as follows. This page is optional, If you want you can remove this page.

Finally, I wrote a few if case for trigger this pages. The screenshot is as follows.

You can check example as follows link;

Expo: exp://


The screenshots;

Thank you.

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


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;


show databases

use databaseName



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.


How to Send Push Notification via Firebase


This post is about Push Notification (For android because I just tried on android device). I will be send push notification to my virtual device end of this post. I used firebase for send.

I skipped create a new project part. Let’s get start. Firstly, I created new project on firebase portal. I opened and clicked Get Started button for start create process. The screenshot is as follows.

After this, I clicked Add Project button on the next page and a new pop-up form opened on my browser. I entered project name and selected analytics location. Finally, I accepted term’s of use before clicking to create button. Now, we have a firebase project. The pop-up form’s screenshots is as follows.

After created project result screen will be as follows.

I clicked Continue in this pop up and then clicked Cloud Messaging button in menu of the left hand side in the next page.

After created a new firebase project, I returned to my react-native project. I opened my project with VS Code. (You can use different Ide after this step.) I opened AndroidManifest.xml (The location is /android/app/src/main/) in react-native project and copied package name. The screenshot is as follows.

In this step I will add firebase to my react-native application. After copied my package name, I returned firebase page. Before I created a new project but I need to enter package name from my react-native application. You can think like an relation. I paste my package name on this screen. The screenshot is as follows.

When I click, firebase gave to me configuration file. I downloaded this file and copied /android/app folder. The screenshot is as follows.

After copied this file, I included react-native firebase package to my react-native application. Firebase library is as follows. You should run this command on command prompt.

npm install –save react-native-firebase

react-native link react-native-firebase

When the library included, I configured some documents for this package. Let’s get start to configuration. Firstly, I added two new library in /android/app/src/main/java/com/pushnotificationexample/ file. The added libraries as follows.

import io.invertase.firebase.RNFirebasePackage;
import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;

And then I went GetPackages section in same file and added two new line as follow.

new RNFirebasePackage(),
new RNFirebaseMessagingPackage()

The screenshot of the changes is as follows.

Now, I finished my updates and closed After close this file I opened /android/settings.gradle and I added the following new two line in this document.

include ‘:react-native-firebase’
project(‘:react-native-firebase’).projectDir = new File(rootProject.projectDir, ‘../node_modules/react-native-firebase/android’)

The screenshot of changes are as follows.

Latest modification is in build.gradle file. (in /android/app/) I added following line in this file.

implementation “”

The screenshot of changes are as follows.

Google wants two new changes. They are for firebase SDK.

For first node should change build.gradle file. (in the /android/ folder.) The screenshot of up to date file is as follows.

Last two lines are for the other build.gradle file. (in the /android/app/ folder) The screenshot of up to date is as follows.

If you finished updates, you can skip next step. It’s not important for now. The screenshot is as follows.

After skip this step, I returned my react-native project and opened App.js file. This file in the root directory. I opened this file and added as follows line. This line for firebase library.

import firebase from ‘react-native-firebase’

After added this library, I added AsyncStorage component between react-native components. Next step for notification methods. Let’s get start.

getToken method;

I used this method for take user token. After this, I added second method for permission request. Permission request method is as follows.

requestPermission method;

Before request permission, we should check the permission. I created another method for this.

checkPermission method;

In summary, Firstly I used checkPermission method. If I have the permission, I need user token. Because of this, I use getToken method. But If I don’t have a permission, I need a permission first. Because of this I use requestPermission method. If user give permission, third method will be getToken method. If user reject request, This notification don’t work. Token is required for notification.

I added this line for trigger to all scenario. The screenshot is as follows.

I used for Genymotion for test. You can use alternatives. I need token for send notification. My device screenshot is as follows.

I clicked to Open GAPPS button top of right corner in the window to install google play store. When It finishes, the device will be restart. After restart, I opened my application and started debug mode for token. For the debug mode, I pressed CTRL + M in Genymotion. After browser opened, I opened to When debugger opened, It will start localhost but we should change localhost to I returned to Genymotion and restarted application. After start, I returned my debugger screen. (in browser) and pressed F12 I checked console tab and I saw user token. The screenshot is as follows.

I copied this token and returned to firebase. Let’s send notification. I clicked Send your first message button in the Cloud Messaging page and create a new notification. The screenshot is as follows.

I filled the second textbox and then clicked Test On Device I used token in this page. The screenshot is as follows.

I selected my application in second step and clicked to next button. The screenshot is as follows.

Click here for github link

Before I wrote this article on another platform in Turkish. That is why some screenshots are Turkish.

How to include React in Available .Net Core Web Application


In this post, I will try to explain “How to include React in available .Net Core Web Application” You can access example code end of the post. Let’s get start.

I don’t have any project for this example. Because of this I created empty project for this example. You can pass the project create step. The screenshot is as follows.

I selected project template on second step. Example project will be web application.

My project is ready now. Before start to development, I should include some packages for react. This packages are as follows.


JavaScriptEngineSwitcher.ChakraCore (If you are using Windows x86 or another OS, you should download your version for this OS.)


After downloaded packages, I modified startup.cs file in my project. Firstly, I added new libraries to startup.cs. This libraries as follows.

using Microsoft.Extensions.DependencyInjection

using JavaScriptEngineSwitcher.ChakraCore

using JavaScriptEngineSwitcher.Extensions.MsDependencyInjection

using React.AspNet

My page is as follows.

I added the following code to the end of configureservices method.

I added code in configure method as follow. This code must be before static files. The screenshot is as follows.

I created JSX folder in wwwroot. I will use this folder for my react files. Let’s start.

Firstly, I added new div in my masterpage layout. (_layout.cshtml) My react components will use this div. The screenshot is as follows.

Now, I can write react code. I added a new jsx file in my jsx folder. The screenshot is as follows.

My component details are as follows.

In this step, I called react file from _layout.cshtml. I added codes bottom of in my master page as follow. (_layout.cshtml)

Script links are as follows.

I started localhost and It worked!


I shared example codes on github. You can access from this link.


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


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 for menu icons. You should change name properties in above code. Finally, our project is as follows.

You can find project code in here.


Static Code Analysis Tool: Sonarqube

Hello my friends,

I started use Sonarqube in my projects. In this post, I will try to tell Sonarqube in windows computer.

What will we examine in this post?

  • What is Sonarqube?
  • How to install Sonarqube?
  • How to create a new project in Sonarqube trenbolone australia?
  • How to scan .NET project with Sonarqube?
  • What is the mean of results titles in report?

First topic is What is Sonarqube. Sonarqube is static code analysis tool. It’s open source and It is support 20+ language. Let’s start examine the Sonarqube.

Now, we are starting second topic. Firstly, we will download Sonarqube tool in this link for second topic.

Screenshot 1: Download Page

We will extract setup file from zip, when download finished. The setup files are in the bin folder.

Screenshot 2: Setup Files

We will use StartSonar.bat file for the install. Location for StartSonar.bat is as follows.

Screenshot 3: StartSonar.bat location

Sonarqube will be ready for use, when the installation finished. If you see the field marked with yellow text, It’s mean your application installation finished. The screenshot is as follows.

Screenshot 4: Sonarqube installation finish

Default address is http://localhost:9000 for Sonarqube. Start page screenshot is as follows. Now, we can login our application. Firstly we are click log in button for this. This button is right side on the header.

Screenshot 5: Sonarqube start page and log in button.

Default username and password are admin for login. Now, we can start create a new project in sonarqube. Firstly, we are click Create new project button in our Projects page.

Screenshot 6: Create new project

We need to input project key ad display name for create a new project. My area is as follows.

Screenshot 7: Project key and display name

Last step before analysis, We will create a token for scan. I am usually use default values in this step. The screenshot is as follows.

Screenshot 8: Project token

My token;

Screenshot 9: Token example

Now, we will choose main language and download files. Sonarqube will use this files for scan.

Screenshot 10: Main language select and download scan files.

After downloaded package, we will add package path in environment variable list. This step is as follows.

Screenshot 11: Environment variables list update

Finally, Sonarqube is ready for scan. Firstly, we will open example project folder in command prompt screen, after then we are copy first command from dashboard page and run in command prompt. The screenshot is as follows.

Screenshot 12: First command for scan

We will open Developer command prompt, when first command finished. We will run second command in this windowd. (Developer command prompt.)

Screenshot 13: Second command for scan.

After finished second step, we will turn back to command prompt for finally step. Now, we are copy third code from dashboard page and run. Sonarqube will open results in our screen, when scan finished. My results are as follows.

Screenshot 14: Results page

Scanning finished. Now we will examine results as follows 6 title.

Quality Gate: Sonarqube have some quality gates for projects. This quality gates is consist of some metrics. I used default Sonarqube quality gate. You can create a new quality gate or change available quality gates. Quality gate is important for project because developers will write high quality code for pass the this gate. My default quality gate metrics is as follows.

Screenshot 15: Quality gate metrics

Bugs: You can see code error in this project under this title. If you click 40 (It’s for my project), you can see code errors. For example my bugs are as follows.

Screenshot 16: Bugs

If we click any bug, what can we see?

For example, I clicked first code error;

  • This bug is in wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.css file.
  • This bug created 21 hours ago.
  • This bug’s effort is 1 minutes. 
  • This bug didn’t assign any user yet. You can click not assigned and assign any people.
Screenshot 17: Bug details

Vulnerabilities: This title about security and as important as bugs. My example project didn’t have error of this category but, this detail page as like as bugs detail page.

Code Smells: This title is about maintenance and legibility. We have a 23 code smells and we need 3 hours for solved this.

Screenshot 18: Code smells

If we have a look example code smell detail;

  • This code smell is in Pages/Index.cshtml.cs file. 
  • This code smell level is Critical.
  • This code smell effort is 5 minutes. 
  • This code smell created 21 hours ago. 
Screenshot 19: Code smell details.

Coverage: This category is about tests. We didn’t write test for our test project. If we write test, we can see rate in the project.

Duplications: This category is about ratio reused rows to total rows. Result for my example project is as follows.

Screenshot 20: Dublications

See you next posts. 

Good works 🙂