This is a personal project to continue learning about web development. This is web app follows Building React and ASP.NET Core Application from Linkedin Learning. The web app will feature the following:
- React.js for the frontend
- ASP.NET Core API for the backend
- Redux
- Auth0 for authentication
React or ReactJS is a JavaScript library for building user interfaces. React renders data to the DOM ,however, usually requires the use of additional libraries for state management, routing, and interaction with an API.
- Component - An individual item that can obtain other items. It serves as a container or logic to get data, other components for specific functionality etc.
- Props - Similar to an HTML attribute. It allows any data type to be passed as long as JavaScript support it.
- Context is used to pass data through many levels
- State - A place where component data is saved. Each component can have a state.
- JSX - Allows XML like code to be written by combining HTML, CSS and JavaScript.
- Separation of the concerns can be achieved by separating the HTML, CSS and JavaScript code into different files.
- Lifecycle - Every components goes through certain cycles and all those separate stages can be accesd by using React lifecycle methods.
Redux is a state management tool for JavaScript applications. The main concept behind Redux is that the entire state of an application is stored in one central location.
- Store - the database of an application which stores different states defined in the application
- It is a single immutable data searcher
- It serves as a client side single source of truth
- Reducer - the table of an application which describes how the application's state changes
- It accepts two parameters - an action and the previous state
- Action - represents payloads of information that are dispatched to the store from the application and are usually triggered by user interaction
Clone this repository to your local machine.
$ git clone https://github.com/jeremymaya/react-c-sharp-practice.gitTo run the program from Visual Studio: Select File -> Open -> ```ReactCSharpPractice``
Next navigate to the location you cloned the Repository.
Double click on the ReactCSharpPractice directory.
Then select and open ReactCSharpPractice.sln
Go to your project's roo folder in Terminal and install the following libraries:
- Axios (sends HTTPS requests to the API endpoints)
npm install axios --save
- Redux
npm install redux
- React Redux (connects redux store to ReactComponents)
npm install react-redux
- Redux Thunk (a redux middleware for async actions or promises)
npm install redux-thunk
- Auth0
npm install @auth0/auth0-spa-js
Go to Auth0 website and make an account.
Next follow the Auth0 Single-Page App for React guideline to configure Auth0 account.
- Linkedin Learning - Building React and ASP.NET Core Application
- Stack Overflow - What are differences between redux, react-redux, redux-thunk?
- Auth0 Docs - Auth0 Single-Page App for React
1.0: Project Completed - 13 Jan 2020 6:00 PM 0.0: Project Started - 06 Jan 2020 9:17 PM