https://github.com/hemnath-v/front_end_journey
" Learning frontend development step by step with HTML, CSS, JavaScript, React, Tailwind, Bootstrap and other frameworks. "
https://github.com/hemnath-v/front_end_journey
bootstrap5 html5-css3 javascript-es6 javascript-framework reactjs tailwindcss-v3 typescript
Last synced: 3 months ago
JSON representation
" Learning frontend development step by step with HTML, CSS, JavaScript, React, Tailwind, Bootstrap and other frameworks. "
- Host: GitHub
- URL: https://github.com/hemnath-v/front_end_journey
- Owner: Hemnath-V
- Created: 2025-02-08T04:57:47.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2025-03-30T08:48:38.000Z (3 months ago)
- Last Synced: 2025-03-30T09:25:28.622Z (3 months ago)
- Topics: bootstrap5, html5-css3, javascript-es6, javascript-framework, reactjs, tailwindcss-v3, typescript
- Language: HTML
- Homepage:
- Size: 14.9 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Frontend Journey
This project documents my journey learning frontend development.
## Day 1: HTML Basics
- Created an introductory HTML page with text and images.
## Day 2: Enhanced Elements
- Added more images, lists, links, buttons and form elements.
## Day 3: CSS Basics
Styled webpage elements with background colors, text alignment, font properties, and custom paragraph class.
## Day 4: Java Script Basics
Explored JavaScript basics, including variables, data types, objects, arrays, functions, and console logging for dynamic web development.
## Day 5: JavaScript Event Handling
Implemented an onclick button to dynamically change text color using JavaScript functions
## Day 6: Java Script Asynchronous
Asynchronous Concepts with examples
<<<<<<< Updated upstream
## Day 7: CSS Positioning
Positioning Concepts with examples
## Day 8: CSS Flexbox
Explored CSS Flexbox concepts, including flex container properties, flex items alignment, justify-content, align-items, and responsive layouts.
## Day 10: Bootstrap Basics
Introduced Bootstrap for responsive web design.
Explored grid systems, buttons, cards, and navigation bars.
## Day 11 - 13: Netflix Landing Page Clone
Started building a Netflix landing page clone. Created the basic HTML structure, including the header, hero section, features, and footer. Used semantic HTML elements for better readability and accessibility.
## Day 14 - 15: CSS Grid, Before & After, Transformations
Explored CSS variables, ::before & ::after pseudo-elements, and list styling with markers & emoji icons. Implemented transformations like translate, rotate, and scale for dynamic effects.
## Day 16: React Introduction & Basics
Learned about React and its core concepts.
Understood how React renders components efficiently using the Virtual DOM.
## Day 17: React Components & Types
Explored React components and their importance in UI development.
Learned about functional components and class components.
## Day 18: JSX Basics
Created a simple React component using JSX.
Used JSX expressions to display dynamic values inside HTML elements.
Applied inline and external CSS styles in JSX.