INTRODUCTION: > FULL STACK
JUNIOR:
> Professional React Developer
> Create-App Create fully functional app
> React BootStrap best website UI design
> React Hooks (useState, useEffect) manage a state in component level
> React Context manage state of app in a predictable way
> Node.Js and Express.Js build a backend API for React App
> Mondb and Mongos to save/retrieve Data in the Database
> Json Web Token to authenticate usera
> Paypal checkout button to make payment for the orders
> Heroku cloud Application To deploy your website to the internet.
SENIOR:
> Working with Google MAP to show user location on the map to get customer address
> Advanced Mongodb functions like aggregation to calculate summary data for admin dashboard
> Config MailGun email service to send emails to customers
> Display pro chart using google chart
> Upload your files on Cloudinary services.
> End built Pro ecom website
START UP TOOLS: > Google Chrome (Pro web dev test browser) > MS VSCode > NodeJS > LTS version > GIT (wind) - git-scm.com > Setup VS Code Terminal to Default (Git Bash) as terminal
>>> Install Extension in VS Code:
* Prettier - Code
> VSCode >> Setting: search for: 'defaultFormat' and Select Prettier in the dropdown list
> VSCode >> Setting: Search for: 'formatonsave' and Checked format on save option
> VSCode >> Setting: search for: 'singlequote' and checked Single Quote (this will change all "" to ''
> VSCode >> Ctrl + Shift + P: >json 'Open Settings (Json)':
> Add new line: "editor.braketPairColorization.enabled":true
* eslint - (shows all errors in the codes)
* JavaScript (ES6) code snippets (code faster)
* ES7+ React/Redux/React-Native snippets (for quick react code creation: imp or rfc)
* Github pull request and issues
Your authorization token:
vscode://vscode.github-authentication/did-authenticate?windowid=1&code=a9421e6cea2a3839eba9&state=4a2aa80c-e63d-4a93-a05f-022df4658aad
✅ Copied
Copy the token.
Switch back to VS code.
Click Signing in to github.com... in the status bar.
Paste the token and hit enter.
* Console: npm install nodemon --save-dev (Auto reload express node Server)
===================================STARTER================================ STAGE - 1
- Introduction to this course what you will build what you will learn who are audiences
- Install Tools Code Editor Web Browser VS Code Extension
- Website Template Create amazona folder create template folder create index.html add default HTML code link to style.css create header, main and footer style elements
- Display Products create products div add product attributes add link, image, name and price
- Create React App npx create-react-app frontend npm start Remove unused files copy index.html content to App.js copy style.css content to index.css replace class with className
- Share Code On Github Initialize git repository Commit changes Create github account Create repo on github connect local repo to github repo push changes to github
- Create Rating and Product Component create components/Rating.js create div.rating style div.rating, span and last span Create Product component Use Rating component
- Build Product Screen Install react-router-dom Use BrowserRouter and Route for Home Screen Create HomeScreen.js Add product list code there Create ProductScreen.js Add new Route from product details to App.js Create 3 columns for product image, info and action