MissCoder✨

Good morning Peeps! 🌟 Today's tasks: ⚡️Class ⚡️React course ⚡️Some js revision ⚡️Brain-storming ideas for a website's requirements of an association Have a nice day!✨ NiyaCodes 🚀

and this time I decided to stick to simple design and coloring y'all gonna see no purple in my projects after now(will be updating my portfolio too)😂 NiyaCodes 🚀

Tired of searching and sending your portfolio, LinkedIn, Github ,and Leetcode....etc separately? me too😭 then saw ninja-girl's socials website and decided to build mineee here is it: orniya's socials 🔗 took me 3 hours btw😭 NiyaCodes 🚀

Learned something new today 💡 So, what is Framer Motion? I’ve prepared my own full-stack roadmap and gone through others’ as well, but I never came across this tool until recently, when I noticed many full-stack developers listing it as a skill. Eventually, someone recommended that I learn it, and that’s when I decided to dig deeper. Done my research, and in conclusion, Framer Motion is basically a framework within a framework (React) to add smooth, modern animations to React components. It’s honestly amazing how vast the tech field is! ✨ NiyaCodes 🚀

4 hours of fighting with React setup 😭 Alhamdulillah finally done! Bruh, setup feels as tough as learning the language itself 😂 Kudos to deepseek for helping, while was chatgpt acting clueless🙄😂 NiyaCodes 🚀

Learned new thing today : So, this "☰" icon is called hamburger icon 🍔 Hmmm makes sense...... NiyaCodes 🚀

Ai is brain rot creative heads are almost dead :)

Install alreadyyyyy so slowwww🥱 NiyaCodes 🚀

Btw I have started "30 days of react" ⚛️ any one can join, if interested⚡️ niyaCodes 🚀

Good morning peeps🌟! Today's to-do-list: ⚡️ Class ⚡️ Information security assignment ⚡️brain-storming ideas for the hackathon ⚡️ Going through Day 2 React topics NiyaCodes 🚀

#Update #hackathon I'm going to participate in my first ever hackathon!!!🥳 Wish me luck NiyaCodes 🚀

My schedule is so mixed up......... it just gets crowded again every time I fix it. Does anyone has a platform recommendation or app to get out of this mess? niyaCodes 🚀

I declare myself as an official: 💥 java hater ✨️ Javascript lover NiyaCodes 🚀

nahhh I changed my mind......

From my experience, I think chatgpt is quicker but deepseek is more accurate. What do u guys think?🤔 NiyaCodes 🚀

Keeping this here to be responsible Week 1 , Day 1 of react: ⚡️What is React and why use it ⚡️How React works (Virtual DOM, component-based architecture) ⚡️Setup: Node.js + Vite or Create-React-App ⚡️Task: Create your first “Hello World” React app NiyaCodes 🚀

Time for reactttt ⚛ NiyaCodes🚀

🗓 30-Day React Roadmap 🧩 WEEK 1 – React Basics (Days 1–7) Goal: Understand React fundamentals, JSX, components, and state. Day 1: What is React and why use it How React works (Virtual DOM, component-based architecture) Setup: Node.js + Vite or Create-React-App 🧠 Task: Create your first “Hello World” React app Day 2: JSX syntax and rules Embedding JS in JSX 🧠 Task: Display your name, age, and favorite color dynamically Day 3: Functional components and props Passing data between components 🧠 Task: Make a Card component that accepts title, image, and text Day 4: State and the useState() hook Event handling (onClick, onChange) 🧠 Task: Counter app with increment/decrement buttons Day 5: Conditional rendering (if/else, ternary, &&) Lists and .map() 🧠 Task: Render a list of users or products Day 6: Styling React components: Inline styles External CSS CSS Modules 🧠 Task: Style your card or list app Day 7: Review + mini project 🧠 Project: Simple “Profile Gallery” app using props, state, and CSS --- ⚙️ WEEK 2 – Interactivity & Hooks (Days 8–14) Goal: Learn forms, side effects, and component interaction. Day 8: The useEffect() hook (side effects) Fetch data from an API 🧠 Task: Display data from JSONPlaceholder Day 9: Handling forms and input states Controlled vs uncontrolled components 🧠 Task: Signup form that displays entered data Day 10: Two-way data binding Form validation basics 🧠 Task: Add simple validation to your form Day 11: Lifting state up Parent-child communication 🧠 Task: Build a color picker that updates parent background color Day 12: React Fragment, keys, and lists optimization 🧠 Task: Dynamic to-do list (add/remove items) Day 13: useRef() hook (DOM access, focus input, store mutable values) 🧠 Task: Auto-focus input field on load Day 14: Review + mini project 🧠 Project: Weather app using useEffect + public API --- 🌐 WEEK 3 – Routing, Context, and Reusability (Days 15–21) Goal: Create multi-page apps and share global state. Day 15: React Router setup (react-router-dom) Routes, Links, and NavLink 🧠 Task: Basic multi-page app (Home, About, Contact) Day 16: Dynamic routes with useParams() Programmatic navigation (useNavigate()) 🧠 Task: Product details page Day 17: Context API (global state management) 🧠 Task: Light/dark theme toggle using Context Day 18: Custom hooks – reuse logic 🧠 Task: Custom useFetch hook for API calls Day 19: useReducer() hook (state logic alternative to useState) 🧠 Task: Counter app using reducer Day 20: React performance optimization (React.memo, useMemo, useCallback) 🧠 Task: Optimize re-rendering of a list Day 21: Review + mini project 🧠 Project: Movie search app using API + Context + Router --- 🚀 WEEK 4 – Advanced Concepts & Final Project (Days 22–30) Goal: Apply everything, add polish, and deploy. Day 22: Folder structure for real projects Absolute imports + reusable components setup Day 23: Axios for HTTP requests Loading and error states 🧠 Task: Fetch and display products using Axios Day 24: State management with Redux (basics) or Context advanced 🧠 Task: Cart system with add/remove items Day 25: Styling libraries: Tailwind CSS, Material UI, Chakra UI 🧠 Task: Add a component library to your project Day 26: Animations with Framer Motion or React Spring 🧠 Task: Animate buttons or cards Day 27: Error boundaries, lazy loading, and suspense 🧠 Task: Add lazy loading for routes Day 28: Connecting backend or mock API 🧠 Task: Fetch from your own Express API (or JSON server) Day 29: Deploying React apps (Netlify, Vercel, GitHub Pages) 🧠 Task: Deploy your final project Day 30: 🎉 Final Project: Build one of these (your choice): ⚡️Todo app with CRUD + localStorage ⚡️Blog app with React Router + Context ⚡️Weather dashboard with API + custom hook ⚡️E-commerce mini app (cart, context, router) NiyaCodes🚀

Idk but I kinda wish I discovered Ai a little bit laterrr Like after being proficient in some stack Those who get it get it...... NiyaCodes 🚀