Danish Qureshi’s Post

⚛️ Day 9 of Learning React.js Today I learned about Functions in JavaScript and how they are used in React. I understood that a function is a block of code that performs a specific task and can be reused whenever needed. Functions help make the code cleaner, more organized, and easier to manage. What I learned today: What is a function Why functions are important How to create and call a function How functions are used inside React components How event handling works using functions Now I can see how functions control logic and interactions inside a React application. Learning fundamentals step by step and building a strong base 🚀 #ReactJS #JavaScript #FrontendDevelopment #WebDeveloper #LearningJourney #StudentDeveloper #Consistency

⚛️ Day 10 of Learning React.js Today I learned about Hooks in React.js. I understood that Hooks allow us to use state and other React features inside functional components. Earlier, state was mainly used in class components, but Hooks make functional components more powerful and flexible. What I learned today: What are Hooks in React Why Hooks are used Basic idea of useState How Hooks improve code structure Managing dynamic data inside components Learning Hooks made me realize how React handles dynamic UI updates efficiently. Things are starting to connect now — components, props, functions, and state. Step by step, building stronger React fundamentals 🚀 #ReactJS #Hooks #useState #FrontendDevelopment #JavaScript #WebDeveloper #LearningJourney #Consistency

"Hot take: Learning React before mastering JavaScript feels like a superpower until you hit a wall 🧱 🧱 React does such a great job of streamlining our workflow that it’s easy to forget how much 'magic' it’s doing under the hood. If you’re struggling with JS fundamentals now, don't sweat it—you're just finally meeting the engine that powers your favorite library!" Working with React is so easy if you follow JS way 👍🏻👍🏻 ❗❗ React looks very hard when you aren't able to tackle most of the problem which requires js fundamental. #React #Javascript #FrontendDevelopment #WebDevelopment

Learning JSX & Conditional Rendering in React Recently strengthened my understanding of two core React concepts: 🔹 JSX – Allows writing HTML-like syntax inside JavaScript. It compiles to React.createElement() and makes UI code clean and readable. 🔹 Conditional Rendering – Enables dynamic UI updates using if-else, ternary operators, and &&, based on state or props. Mastering these fundamentals is essential for building scalable React applications. #ReactJS #JavaScript #LearningJourney

Day 17/21 – My First Steps with React.js ⚛️ Today I started learning React.js, and it already feels like a big shift from traditional JavaScript. To understand the basics, I built a small interactive example using useState. Here’s what the mini project does: • A button increases marks by +5 every time it’s clicked • The total marks update dynamically on the screen • If marks become greater than 35 → the student is marked as PASS • Otherwise the status remains FAIL Concepts I practiced today: • Creating React components • Using the useState hook • Handling button click events • Conditional rendering in React • Updating the UI dynamically based on state This small example helped me understand the power of state management in React— when the state changes, the UI automatically updates. Learning and building consistently with the #21DaysCodingChallenge by #sheryianscodingschool 🚀 #Day17 #ReactJS #FrontendDevelopment #JavaScript #LearningInPublic #BuildInPublic

📚 React Learning — useEffect Today I revised the useEffect hook in React and understood how it helps handle side effects like API calls, timers, and event listeners. Also practiced how the dependency array controls when the effect runs and why the cleanup function is important to avoid memory leaks. Improving React fundamentals step by step. #ReactJS #useEffect #FrontendLearning #JavaScript #ReactJourney

🚀 React.js Basics: Understanding Props vs State While learning and building projects in React.js, one of the most important concepts to understand is the difference between Props and State. 🔹 State Managed inside the component Can change over time Used for dynamic data like counters, forms, UI updates 🔹 Props Passed from parent to child components Read-only (cannot be modified by the child) Used to share data between components 💡 Simple way to remember: State = Internal data of a component Props = Data passed from parent component Understanding these two concepts clearly helps in building clean, reusable, and scalable React components. I created this visual to make the concept easier for beginners who are learning React UI Development. 🌐 Explore my work: https://allconverthub.com https://lnkd.in/g4Hnzt9Z #ReactJS #FrontendDevelopment #UIDeveloper #JavaScript #WebDevelopment #ReactLearning #FrontendEngineer #Coding

Learning React made me realize something — frontend isn’t about “changing elements.” It’s about controlling state and thinking in systems. Once that clicked, everything started making sense. Still early in the journey, but the foundation is getting stronger every day. Next stop: advanced hooks and performance optimization. Building > consuming. #ReactJS #JavaScript #FrontendDeveloper #WebDevelopment #CodingJourney #LearnInPublic #FullStackPath

💻 Building Forms in React with TypeScript I wanted to share a small learning experience from my recent training while working with React and TypeScript. Today I worked on building a form using React, and it turned out to be a really interesting hands-on exercise. A form might look simple at first, but once you start adding validation, managing state, and handling user feedback properly, you realize how many things are actually happening behind the scenes. While building the form, I used React hooks like useState and useEffect to manage form data and updates. I also implemented input validation using Regex so that fields like name, contact number, and duration follow the required format. Some things I practiced while building this: • Managing input fields with useState • Handling form submission and events • Showing error messages when fields are empty or invalid • Preventing form submission when validation fails • Displaying proper feedback after a successful update One thing I found interesting is how React makes form handling more structured compared to traditional JavaScript DOM manipulation, because the UI and state stay connected. At the same time, it also reminded me how important JavaScript fundamentals are, since frameworks like React are built on top of it. Still learning and exploring more every day. 🚀 #React #TypeScript #JavaScript #ReactHooks #FrontendDevelopment #LearningJourney

⚛️ Sharing My React.js Notes Just shared my React.js notes to help anyone who is starting or revising React. React can feel overwhelming at first, but once you understand components, props, state, and hooks, everything starts making sense. I created these notes to simplify the core concepts and make learning React easier for beginners and developers who want quick revision. 📘 These notes focus on: • Components & JSX • Props & State • React Hooks • Event Handling • Basic React Concepts Hope this helps developers who are on their React learning journey 🚀 📌 Save this post for revision 💬 Comment “REACT” if you want the notes 🔁 Share with someone learning React All credit goes to the original creator of the material. #React #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #Coding #Developers #TechLearning