Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/princebansal7/web-development-concepts

Learn web development including JavaScript (ES6), Tailwind, ReactJS, Databases, Frontend-Backend concepts and much more.
https://github.com/princebansal7/web-development-concepts

async-await css3 dom-manipulation es6 express express-middleware hooks html-css-javascript html5 javascript jwt-authentication mongodb moongose reactjs recoil tailwind-css typescript webdevelopment zod-validation

Last synced: 1 day ago
JSON representation

Learn web development including JavaScript (ES6), Tailwind, ReactJS, Databases, Frontend-Backend concepts and much more.

Host: GitHub
URL: https://github.com/princebansal7/web-development-concepts
Owner: princebansal7
Created: 2023-09-18T09:59:45.000Z (over 1 year ago)
Default Branch: main
Last Pushed: 2024-12-02T19:53:51.000Z (about 2 months ago)
Last Synced: 2024-12-02T20:34:34.891Z (about 2 months ago)
Topics: async-await, css3, dom-manipulation, es6, express, express-middleware, hooks, html-css-javascript, html5, javascript, jwt-authentication, mongodb, moongose, reactjs, recoil, tailwind-css, typescript, webdevelopment, zod-validation
Language: JavaScript
Homepage: https://github.com/princebansal7/Web-Development-Concepts?tab=readme-ov-file#web-development-concepts
Size: 16 MB
Stars: 5
Watchers: 1
Forks: 1
Open Issues: 1
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Web Development Concepts

I created this repository to provide a clear and structured pathway for understanding web development, from the basics to advanced full-stack concepts. This resource is designed to help you grasp essential technologies—like HTML, CSS, and JavaScript, React etc while diving deeper into critical aspects such as backend connectivity, frontend-backend integration, and database management and integration.

- `nvm` commands | [nvm](https://github.com/princebansal7/JavaScript-Projects?tab=readme-ov-file#steps-to-install-nodejs-via-nvm) 

- **Frontend**:

 

  - HTML | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/html-basics)

  - CSS | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/css-basics)

  - JavaScript | [JS-30-Days](https://github.com/princebansal7/JavaScript-30-days?tab=readme-ov-file) | [ES6](https://github.com/princebansal7/Web-Development-Concepts/tree/main/javascript-es6) | [Old](https://github.com/princebansal7/JavaScript-Projects/tree/main/basics) 

  - DOM Manipulation | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/dom-manipulation)

  - React JS foundation

    - `state` concept with **ToDo app** using naive DOM manipulation | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/dom-manipulation/todo-with-state)

    - `state` rendering on DOM like React does under the hood (High level) | [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/dom-manipulation/todo-react-underhood/todoReactUnderhood.html)

  - React JS (2024) | [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/react-js/README.md#react-basics-and-its-need)

  - React Js (Old) | [Link](https://github.com/princebansal7/Learn-React)

  - Tailwind | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/tailwind#tailwind-basics)

  - TypeScript | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/typescript#typescript)

- **Backend**:

  

  - Express servers | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/server-code)

  - Middlewares | [Pre-req](https://github.com/princebansal7/Web-Development-Concepts/blob/main/server-code/06.withDRY.js) | [Examples](https://github.com/princebansal7/Web-Development-Concepts/tree/main/middlewares)

  - Input validation, Zod | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/input-validation)

  - fetch - [link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/fetch-axios-api/fetch.js) | axios - [link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/fetch-axios-api/axios.js)

  - Authentication - JWT | [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/authentication-concepts/03.authenticationPrereqs.md)

  - Database connectivity | [mongoDB connect](https://github.com/princebansal7/Web-Development-Concepts/blob/main/databases/mongoDB/01.mongooseConnect.js)

  - frontend-backend connection | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/frontend-backend-connect)

  - Debouncing [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/frontend-backend-connect/03.throttling-debouncing/frontend.html) | Throttling [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/frontend-backend-connect/03.throttling-debouncing/backend.js)

  - Serverless Backend deployment - CloudFare | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/serverless-backend#backend-servers-and-serverless-deployment)

  - Reverse proxy & certificate management | [Link](https://github.com/princebansal7/backend-server-cloud?tab=readme-ov-file#backend-server-cloud)

  

- **Databases** 

  

  - Databases NoSQL & SQL | [theory](https://github.com/princebansal7/Web-Development-Concepts/tree/main/databases#databases-concepts)

  - MongoDB - NoSQL | [Example](https://github.com/princebansal7/Web-Development-Concepts/tree/main/databases/mongoDB)

  - Postgres - SQL | [Example](https://github.com/princebansal7/Web-Development-Concepts/tree/main/databases/postgres)

  - ORM (Object Relational Mapper) & Prisma | [Link](https://github.com/princebansal7/Web-Development-Concepts/blob/main/databases/README.md#orm-object-relational-mapping--prisma)

   

- **Projects**

  

  - MongoDB Project (structured) | [without-auth](https://github.com/princebansal7/Web-Development-Concepts/tree/main/projects/01-mongo-with-routes) | [with-auth](https://github.com/princebansal7/Web-Development-Concepts/tree/main/projects/02-mongo-with-jwt-auth)

  - React ToDo App (frontend & Backend) | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/projects/03-todo-app)

  - Background update | [Link](https://github.com/princebansal7/Web-Development-Concepts/tree/main/projects/04-react-tailwind-bgchange#readme) | [Demo](https://www.youtube.com/watch?v=eo0Fj72lmsc)