Skip to content

Latest commit

 

History

History
114 lines (90 loc) · 5.12 KB

README.md

File metadata and controls

114 lines (90 loc) · 5.12 KB

FullStackWebDev_Playground 🚀

Welcome to FullStackWebDev_Playground! This repository is a playground where I've explored various concepts and technologies in full-stack web development. From understanding the basics of web development to building complex applications, this repository covers a wide range of topics.

Table of Contents

  1. Introduction
  2. What I've Learned
  3. Key Topics Covered
  4. Supplemental Frontend Technologies
  5. Projects Showcase
  6. Acknowledgments

Introduction

In this repository, I've documented my journey of learning full-stack web development. Starting from the fundamentals of web technologies to diving deep into advanced topics, this repository serves as a comprehensive resource for anyone looking to explore the world of web development.

What I've Learned

Throughout my journey, I've gained hands-on experience with a wide range of topics, including:

Key Topics Covered

Frontend Technologies

  • What is Web? 🌐
    • Understanding the basics of web development and how the web works.
  • Markup with HTML & JSX 🎨
    • Learning HTML for creating the structure of web pages and JSX for building React components.
  • Flexbox, Grid & Responsiveness 📐
    • Mastering layout techniques with Flexbox and Grid and ensuring responsiveness across different devices.
  • Bootstrap Layouts & Components 🛠️
    • Exploring Bootstrap for building responsive and visually appealing layouts and components.
  • Frontend UI Framework - Tailwind CLI 🖌️
    • Leveraging Tailwind CLI for rapid UI development and styling.
  • Core JavaScript & Object Orientation 🚀
    • Understanding the fundamentals of JavaScript and object-oriented programming.
  • Async JS - promises, async/await ⏳
    • Working with asynchronous JavaScript using promises and async/await.
  • DOM & Events 🎉
    • Manipulating the Document Object Model (DOM) and handling events in web development.
  • Event Bubbling & Delegation 🔄
    • Understanding event bubbling and delegation for efficient event handling.
  • Ajax, Axios & fetch API 🌐
    • Working with asynchronous data fetching using Ajax, Axios, and the fetch API.
  • Functional React Components ⚛️
    • Building functional components in React for a scalable and modular codebase.
  • Props & State Management 🔗
    • Managing component data with props and state in React.
  • Dynamic Component Styling 🎨
    • Dynamically styling React components based on state and props.
  • Functions as Props 📝
    • Passing functions as props to child components for inter-component communication.
  • Hooks in React : useState, useEffect 🎣
    • Utilizing React hooks like useState and useEffect for managing component state and side effects.
  • Material UI 🖼️
    • Integrating Material UI for building beautiful and responsive user interfaces.
  • Custom Hooks 🛠️
    • Creating custom hooks in React for reusable logic across components.

Backend Technologies

  • Express, Nodejs & npm 🚀
    • Building server-side applications with Express.js and Node.js.
  • REST APIs 🌐
    • Creating RESTful APIs for client-server communication.
  • Routing, cookies & session 🍪
    • Implementing routing and managing cookies and sessions in web applications.
  • Middlewares deep dive 🔄
    • Exploring middleware concepts and their role in web development.
  • EJS Templating 📄
    • Using EJS for server-side templating in web applications.
  • MVC Architecture 🏗️
    • Understanding the Model-View-Controller architecture pattern for organizing code.
  • Client & server side Validations ✅
    • Validating data on both the client and server sides for robustness.
  • Error Handling & flash-connect 🛑
    • Implementing error handling strategies and using flash messages for user feedback.
  • Authorization 🔒
    • Implementing user authentication and authorization in web applications.

Cloud Technologies

  • Deployment with Render 🚀
    • Deploying web applications to the Render platform for production use.
  • Cloudinary & MapBox with Geocoding ☁️
    • Integrating Cloudinary for image storage and MapBox with Geocoding for mapping functionality.

Supplemental Frontend Technologies

  • Redux & Redux Toolkit 🔄
    • Exploring state management in large-scale applications with Redux and Redux Toolkit.

Projects Showcase

Here are some of the projects I've built as part of my learning journey:

  • Spotify Player Replica (CSS)
  • Simon Says Game (JS)
  • Todo List App (JS)
  • Real-time Weather App (React & Material UI)
  • WanderLust (Full Stack Major Project with Deployment)

Acknowledgments

A special thanks to all the online tutorials, documentation, and community forums that have helped me along the way. Also, a shoutout to the developers and mentors who've provided guidance and support throughout my learning journey.