In this course we will be building a weather forecasting react application using the openweather API.
Term `aTrivia` is used to give a vague idea about the assignments that will be given in the chapter.
Note: Course structure is built considering most of the learners are beginners. The first two chapters might take more time than any others.
Introduction to JS
- Hello JS
- history, syntax
- Internet & How browser works
- Difference between HTML, CSS and JS
- Understanding Browser Console
- Declaration & Assignment
- Case Sensitivity in naming
- `+, -, *, /, %, ++, –,`
- Assignment(`+=, -=, *=, /=`)
- Conditional Operators(`==, >, <, >=, <=, ?:`)
- Escape Sequences
- the backslash(`\`) literals
- Arrays & their operations
- functions on arrays(`push, pop, shift, unshift`)
- Functions – defining and reusing
- Scope of `var`
- Conditional Statements
- * try?
- The JS `Math` module – about the usability of js `Math`
- `DOM` and its `events`
aTrivia: Downloading the city dataset(around 200K cities) from openweather and perform actions on it such as creating a json object…
ES6 and other buddies
This chapter gives an in-depth idea about the new features in the ES6 standard.
- what is ES6?
- The differences
- `let, const`
- `let` vs `var`
- Mutation & freezing
- The Arrow(`()=>`) function
- Rest parameters and the spread operator
- Destructive Assignment
- concise object literals
- Class syntax with getter and setter
- `import` vs `require`
- The Other buddies
- Regular Expressions
- Functional programming
- high order functions
aTrivia: Wrap a general XMLHttpRequest into a promise in order to reuse that in making API calls and fetching the data. generating our own prototype function over a object and some other assignments that helps in understanding the ES6 features along with regex etc.,
Node.js & its friends
- what is `node.js`?
- what is package manager?
- `npm, yarn …`
- integrating third party libraries without `npm`
- integrating libs with `npm`
- Virtual DOM – advantages of VDOM
- differences without using VDOM
aTrivia: Building a sample react component, build the same component without using react…
React Notations * `jsx`
- lifecycle events
aTrivia: Building components that will make the learner understand each of the notations
- A brief intro to CSS
- Inline Styling
- Styling using external libraries.
aTrivia: Building components in different styling variations. building individual static weather type components(sunny, haze etc.,)
Building the React Application
- Syntax Standards
- Re-usable library functions
- How to use React context
- Advanced integrations
- Routing – Authentication
aTrivia: Building the final app with options like theme switch etc.