Posts

Showing posts from June, 2025

React Concepts Cleared – Ready to Build (Day 7)

 React Basics – Done ! Today I dedicated my time to following a React tutorial and revising all the foundational React concepts . It felt great to walk through everything step by step with practical implementation.       What I Covered: ✅ React setup and course introduction ✅ Created a basic JavaScript project in React ✅ Understood functional components and how to structure them ✅ Practiced passing data using props ✅ Applied inline and external styling techniques ✅ Worked with state using useState hook ✅ Implemented useEffect hook for side effects and data loading What I Learned: React is all about components — building UI in pieces that work independently useState helps manage changing values dynamically inside components useEffect runs side effects like data fetching, and needs to be carefully handled to avoid re-renders Props help pass data from parent to child — a core concept in React Styling in React can be done in mult...

React Done & TypeScript Kickoff (Day-6)

  React Wrapped Up & Hello TypeScript! Today was all about wrapping up React and diving into TypeScript basics . I completed all the remaining React interview questions and started exploring what TypeScript brings to the table for frontend development. What I Did:  React Questions Completed: Finished all the remaining React questions from the shared interview prep list Covered important concepts: Lifecycle with hooks ( useEffect , useState ) Optimization using useMemo , useCallback Controlled vs uncontrolled components Props drilling, dispatch, Reducer. React performance and best practices   TypeScript Basics Explored: Learned how to define types and interfaces Go through  type annotations in TypeScript. Understood type inference , union types, and generics Compared type vs interface and when to use which What I Learned: useCallback and useMemo are powerful but should be used wisely TypeScript makes code more p...

JavaScript Deep Dive + React Review (Day-5)

 JavaScript & React – Interview Prep Mode Today was all about preparing for frontend interviews , and I focused heavily on reviewing core JavaScript and React concepts from the shared 150+ question set. What I Covered: JavaScript Topics: Completed all JS questions from the set Focused particularly on: Promises & Callback functions Closures and how they work under the hood Async/Await and handling asynchronous logic These topics were a bit tricky at times, but revisiting them helped me gain more confidence and clarity. React Topics (Partially Covered): Reviewed around 90 questions Focused on core concepts: useState , useEffect , useMemo Type-related questions and common hook usage I still need to complete the remaining React questions, but the progress so far has been good i learnt more about these topics than i knew before.  What I Learned: Revisited how closures work and why they’re important in functional JS. Understood as...

Frontend Interview Prep (Day-4)

HTML & CSS Revision Day Today I focused completely on strengthening my HTML and CSS concepts. There were a total of 150 questions related to HTML and CSS shared as part of our interview prep material — and this inspired me to go deep into the core fundamentals. I went through a curated GitHub repo: 100 Days of Frontend Interview Questions What I did today Practiced basic HTML structure and semantic tags Played with different CSS layout methods : Flexbox for horizontal/vertical alignment CSS Grid for 2D layout structuring Revised CSS properties like z-index, margin and padding. Focused on building simple UI layouts using just HTML and CSS Tried keeping designs responsive and clean What I Learned: The importance and proper HTML structure When to use Flex and Grid in different layout situations How margin , align-items , and justify-content behave with Flexbox CSS units like % , rem  make layout more adaptive. Challenges Faced: Struggled a...

GitHub User Search App – Day 3

  What I Worked On Today I continued working on the GitHub User Search App and successfully completed the entire project ! 🎉 This includes designing the layout, integrating the API, and even implementing the dark mode toggle . Tasks Completed: Connected the GitHub Users API using fetch() in JavaScript Displayed real-time user data including: Profile picture, username, join date, bio Repo count, followers, following Location, blog, Twitter, and company info Styled the layout using CSS for a clean and responsive UI Implemented dark mode toggle with a smooth switch Handled invalid usernames with a “User not found” message Polished the UI for desktop and mobile views What I Learned How to fetch data from APIs and display it dynamically on the page How to update the DOM with user-provided input Improved my CSS styling and layout structuring using Flexbox Gained clarity on how to handle different data cases from APIs Understood better ...

Starting the GitHub User Search App (Day - 2)

Project Exploration of Github User Search App Today I officially began working on the GitHub User Search App challenge from Frontend Mentor . This marks the beginning of building a real-world frontend project from scratch What I Did Today Explored the challenge brief and UI on Frontend Mentor to understand the overall layout and user flow Carefully observed the design to note color palettes, typography, spacing, and responsive behavior Reviewed and revised important concepts in HTML , CSS , and JavaScript , especially related to: API handling in JS DOM manipulation CSS flex and grid layouts Read documentation and tutorials related to: CSS design techniques for layout structuring JavaScript fetch API to prepare for API integration Set up the basic project structure using HTML and CSS Created the layout for the search box and initial user info card with HTML + styled with CSS What I Learned Importance of design breakdown before starting a proje...

Revising GitHub CLI commands (Day1)

GitHub CLI Revision Today I marked the beginning of my revision journey, and I started with GitHub CLI.  I revised all the commands using GitHub Docs and Git Cheat Sheet. Also I revised from GeeksforGeeks also.  Practiced some basic core commands like:  git init, git clone git add, git commit  git push, git pull  git branch, git merge, git checkout Also Created a test repo and tried to pushed the commits using CLI.  I read full explanations from GeeksforGeeks.  Git Workflow -  Also understand how git workflow-> from staging area, working directory.  GitHub also helps in versioning controlling  Challenges -  Sometimes, merge conflicts led to minor confusions like head and current change but exploring little more from Chatgpt and documentation helps in figuring it out.  Gracias- Grateful to have a mentor for guiding me  I'm thankful for this opportunity to revise more and understanding this concept more in a better way ab...