Skip to main content

Posts

Showing posts with the label ReactJS-Technology

Part-3 | .NET 6 Web API | SQL Database | React JS(v18) | CRUD Example

The main objectives of this article are: .Net6 Web API Install .NET6 SDK Create .Net6 Web API Application Entity Framework Core  Install Entity Framework Core NuGet SQL Connectionstring Setup Entity Framework Core Database Context .NET6 Web API: Web API is a framework for building an HTTP service that can be accessed by any client like a browser  mobile devices, and desktop apps. In simple terminology API(Application Programming Interface) means an interface module that contains a programming function that can be requested via HTTP calls to save or fetch the data for their respective clients. Some of the key characteristics of API are: Supports HTTP verbs like 'GET', 'POST', 'PUT', 'DELETE', etc. Supports default responses like 'XML', and 'JSON'. Also can define custom responses. Supports self-hosting or individual hosting, so that all different kinds of apps can consume it. Authentication and Authorization are easy to implement. The ide

Part-2 | .NET 6 Web API | SQL Database | React JS(v18) | CRUD Example

The main objectives of this article are: Creating React JS(v18) Application. Install React JS Bootstrap Add Bootstrap Menu Create React JS Application: To create a React JS application our local machine should contain NodeJS. So go to "https://nodejs.org/en/download/". Command to create the ReactJS application. npx create-react-app my-app Command to run and start the ReactJS server. npm start Let's go through the project and explore important files. index.html:  Inside the public folder we can see the index.html. Only the HTML file of the entire ReactJS application. It contained a 'div' element whose 'id' value is 'root', inside of this element all ReactJS components get rendered. index.js: Entry javascript file for ReactJS. It helps paint 'App' component content in 'index.html'. App.js: The 'App.js' react component. It returns the 'JSX'(Javascript XML) content(JSX means writing HTML code inside of javascript dir

Part-1 | .NET 6 Web API | SQL Database | React JS(v18) | CRUD Example

The main objective of the article are: .Net 6 Web API And React (V18) Application Communication Install SQL Server And SQL Management Studio Create A SQL Database Create A SQL Database Table .Net6 Web API And React(V18) Application Communication: User requests the React JS application(single page application) then js files are downloaded and then runs the app on the browser. Since React JS is a single-page application, it depends on API for data to display. API runs at the server that gives JSON response. API communicates with the database for fetching the data. Install The SQL Server And SQL Management Studio: First, install the SQL server on our local machine. So go to "https://www.microsoft.com/en-in/sql-server/sql-server-downloads" and then install the developer version which is accessible and fully functional. Next, install the SSMS(SQL Server Management Studio) IDE at "https://docs.microsoft.com/en-us/sql/ssms/download-sql-server-management-studio-ssms?view=sql-