Full stack Web development

1. Basic Software Tools
1. Text editor or IDE, VSCode, Sublime Text, Atom
2. Web browser, Chrome, Firefox
3. Design and mockup, XD, photoshop, sketch
2. HTML and CSS
1. Semantic HTML5 elements like header, footer, section
2. Basic css ( positioning, box model etc. )
3. Flexbox and css grid
4. Css variables ( custom properties )
5. Browser dev tools and dev extensions like react, dev tools
3. Responsive layout ( you sould not be building the website or app which dosent look good in different browsers )
1. Set viewport
2. Fluid widths
3. Media quires
4. rem over px ( or pixel )
5. Mobile first, stacked columns
4. Basic web deployment
1. Domain resistration
2. FTP, SFTP file upload like filezilla
3. Use AWS, azure
5. SASS pre-processor ( wirte a css like programming )
1. Structured CSS
2. Variables
3. Nested css
4. Mixins and functions
5. Inheritance
6. Vanilla javascript ( Good starting programming language, available in browsers)
1. Data types, functions, conditonals, loop operators
2. Dom manipulaton and Events
3. JSON
4. Fetch Api
5. ES6+ ( Arrow functions, promises, async/await, destructuring  )
7. Basic front end web developer
1. Build static websites
2. Build UI layouts with flex, css grid, or bootstrap
3. Html/css framwork like meterial ui
4. Front end js framework like angular, react or vue js
5. Interacting with servers using HTTP and websockets
6. Testing with jasmine framework, karma test runner
8. State management ( for managing the app level state so that data can be shared it to components )
1. For react Redux, Context Api
2. Apollo ( GraphQL client )
3. VueX for vue js
4. NgRx or shared services for angular
5. Core concepts ( Immutable State, Stores, Reduces, Mutations, Getters, Actions, Observables )
9. Git and tooling
1. Command line basic
2. Git or other vesion control
3. NPM or Yarn installing and managing javascript packages framework and libraries
4. Webpack or parcel for module bundling
5. Gupl or Grunt task runners
6. Code editor Extensions like ESLint, prettier, live server etc.
10. Server side languages
1. Nodejs with express, Koa, Adonis server side framework
2. Java with console java app or rest api jax-rx with Java EE or Spring framework
3. C#, asp.net 
4. php, laravel, symfony
5. GO
6. Things to learn ( basic fundamental syntex, strucure and workflow, package management, http/routing )
11. Databases
1. Relational databases, MySql, PostgreSQL, MSSQL, Oracle SQL
2. NoSQL, MongoDB, CouchBase
3. Cloud, Firebase, AWS, Azure DocumentDB
4. Lightweight, SQlite, NeDB, Redis ( caching or database )
12. Server side rendering ( Frameworks like react, vue, and angular can also be rendered on the server resulting faster web page rendering)
1. Next.js for React
2. Nuxt.js for vue
3. Angular universal for angular
13. CMS
1. Php based, wordpress for building website and rest apis easily, Drupal 
2. JS based, Ghost, Keystone
3. Python based, Mezzazine
4. .net, Piranha, Orchard CMS
14. DevOps, Deployement or more ( Setting up environments testing and deployement )
1. Deployement, Linux, SSH, Git, Server software ( Nginx, Apache )
2. Platforms, Digital ocean, aws, heroku, azure
3. Vertualization, docker ( allows containarize the app to run the app in different environment ), vagrant ( heavier and needed some virtualization )
4. Testing, Unit, integration, smoke testing, functional , system
15. Mobile development,
1. React Native for native ios and android app
2. NativeScriot, with angular, typescript, javascript
3. Ionic, hybrid apps with html/css/js
4. Flutter, mobile sdk for android and ios that uses dart programming languages, came from google
5. Xamarin, mobile apps with C#
16. Desktop apps with electron ( used to build powerful cross platform desktop application using javacript
1. Uses chromium and node.js 
2. Compatible with windows, linux
3. Crash reporting, debugging and profiling
4. Text editor, like VScode, atom are build with it. Postman is another example.
17. GraphQL and Apollo (Revolutionary new way to think about apis. Query language that is much less rigid than standard rest )
1. Request for only what you want in client, instead calling rest, getting huge dataset and filtering in ui
2. Front end and back end collaborate more smoothly
3. Writing queries is very easy and similar to json
4. Apollo is client to make requests to GraphQL server
5. Used with Gatsby static site generator
18. Typescript ( superset of JS with aditional feaures like static typing )
1. Types for variables, functions, etc.
2. Classes, arrow functions and more
3. Other ES6 like features
4. Used mostly in angular, with react and vue
19. Serverless Architecture ( It dosent mean a app without a server, it means someone else manages a server. It eliminates the need for creating and managing your own server )
1. Use 3rd party services to execute "Serverless functions " ( Faas ). Each function run a task on server.
2. Examples, AWS, Netlify and firebase
3. Popular with Gatsby static sites
4. Serverless framework, Toolkit for building serverless app.
20. AI and machine learning ( in web development )
1. Machine learning can allow web apps to adapt over time
2. Used heavily in python but js libraries are available like TensorFlow.js, Brain.js
21. BlockChain technology ( Blockchain for digital transactions in order to make them more efficient and secure )
1. Solidity, language for implementing contracts
2. Mist, used for storing Ethereum, sending transactions and contracts
3. Coinbase api, Blockchain devs can easily build apps and integrate bitcoin
22. PWA ( Progressive Web Apps are regular web apps but give the user a native app experience in terms of layout and functionality)
1. Responsive to fit any form factor
2. Service workers for offline availabilty
3. App like interactions
4. HTTPS
5. REliable , fast and engaging
23. Web Assembly ( Assembly like binary format for code that can be executed by web browsers. Can be generated from higher level languages like c/c++, and RUST. May replace javacript)
1. Faster than javascript
2. Secure, as it enforces same origin and security policies in the browser
3. Open and debuggable

Reference :

1. Thanks to video author, https://www.youtube.com/watch?v=UnTQVlqmDQ0