Day 89 of #100DaysOfCode 🚀 Real data. Real backend. Real developer moment. Today, TradeNova (my Stock Trading Platform) crossed a major milestone — the frontend finally talks to the backend for real. What I built today: - Connected React frontend to Node.js + Express + MongoDB - Implemented actual Buy/Sell functionality — no more dummy data - Stored portfolio data (balance, holdings, orders) in the database - Synced UI state using React Context API - Debugged real-world issues: stale context, API sync failures, cross-component data gaps Biggest learning: Frontend doesn't auto-reflect backend changes. You have to deliberately sync state — through API calls + Context. That's what production apps actually do. Up next: Portfolio UI improvements, real-time stock updates & user authentication. #100DaysOfCode #FullStack #ReactJS #NodeJS #MongoDB #JavaScript #BuildInPublic #CodingJourney #WebDevelopment.
TradeNova Frontend Meets Backend on Day 89 of #100DaysOfCode
More Relevant Posts
-
🚀 Just Built & Deployed My First Full-Stack CRUD Notes App 💻 Finally, I built something that actually feels like a real project, not just practice. 🔗 Live App: https://lnkd.in/dxKgEH28 🔗 GitHub Code: https://lnkd.in/dqz7QSeH This project is a complete CRUD (Create, Read, Update, Delete) application, which is basically the core of most real-world apps managing and manipulating data through APIs. 🧠 What I learned while building this: • How to build REST APIs using Node.js & Express • Connecting backend with MongoDB using Mongoose • Creating schemas & models for structured data • Performing full CRUD operations (create, read, update, delete) • Handling routes, requests (req), and responses (res) • Using req.params for dynamic operations like delete/update • Connecting frontend with backend using Axios • Handling CORS issues between frontend & backend • Understanding real data flow (frontend → backend → database → frontend) • Using .env for securing sensitive data • Converting frontend into build (dist) folder • Deploying full-stack app (frontend + backend together) 💡 Big realization: This is how real applications work User input → API → Server → Database → Response → UI Before this, everything felt separate… Now it all connects. It’s still a simple project, but it gave me clarity on how full-stack systems actually work behind the scenes. Would really appreciate feedback 🙌 #BackendDomination #FullStackDevelopment #NodeJS #ExpressJS #MongoDB #Mongoose #CRUD #RESTAPI #WebDevelopment #100DaysOfCode #BuildInPublic #LearningJourney
To view or add a comment, sign in
-
Day 12/30 of Consistency Challenge 🚀 🎯Project 2: MERN Expense Tracker Almost done with the backend! 📌 Today’s Progress: - Defined Mongoose schema for both Income and expense. - Completed APIs for income and expense along with the endpoint to generate .xlsx files for download. https://lnkd.in/dpJFjDcT ➡️ Next Steps: Build Dashboard API. Move into frontend integration. #BuildInPublic #MERNStack #NodeJS #WebDevelopment #CodingChallenge #BackendDevelopment
To view or add a comment, sign in
-
I recently upgraded my Trading Journal from a frontend-only project to a full-stack application — and this completely changed how I see development. Earlier, it was just UI. Now, it’s a complete system ⚡ Built with the PERN stack (PostgreSQL, Express, React, Node.js), this version includes: 🔐 Secure authentication (login/register with persistent sessions) 📊 Advanced dashboard with real trading metrics (PnL, win rate, RR, avg profit/loss, etc.) 📈 Interactive charts (yearly PnL with monthly breakdown) 🧠 Fully dynamic trade logging (multiple executions, quantity handling) 🎯 Powerful filtering & sorting (date, PnL, market type, order type, and more) ⚙️ Backend-controlled pagination and calculations 📉 Trade-level insights based on selected filters 🎨 Clean UI with modals, drag interactions, and detailed views One major realization from this upgrade: 👉 Frontend shows data. Backend defines the product. Handling calculations, filters, pagination, and performance on the backend made the app scalable and realistic — closer to how real trading tools actually work. 🚀 Deployed and production-ready: Frontend – Vercel Backend – Render Database – Supabase This project pushed me to think beyond UI and actually understand how systems are built. Still improving, but this is a big step forward. #FullStackDevelopment #PERNStack #React #NodeJS #PostgreSQL #WebDevelopment #Projects
To view or add a comment, sign in
-
🚀 I Already Knew Backend… But Sessions Changed How I Think About It You can build APIs… You can connect databases… But until you understand **how apps maintain state**, you're missing a core piece of backend engineering. Today, I implemented **sessions using Express.js** — and it finally clicked 🔥 --- 👉 What I explored: • Tracking user visits using session state • Persisting user-specific data (like name) • Building personalized routes without a database --- 💡 The shift: ❌ Stateless HTTP (every request is independent) ✅ Stateful experience using sessions (server remembers you) 📦 Tech Stack: • Node.js • Express.js • express-session 🔗 GitHub Repository: 👉 https://lnkd.in/dE4ZP2Xv 💬 Takeaway: Sessions are not just a feature — they’re the backbone of **login systems, carts, and personalization**. #NodeJS #ExpressJS #BackendDevelopment #WebDevelopment #MERN #CodingJourney #100DaysOfCode
To view or add a comment, sign in
-
🚀 Built & Deployed a Full-Stack Library Management System I recently built a complete Library Management System using a full-stack JavaScript setup. This project helped me understand how frontend and backend communicate in real-world applications. 💡 Features: • Add / Delete Members • Add / Delete Books with Quantity • Borrow & Return Books with tracking • Live dashboard with real-time updates • Activity log panel for all operations 🛠️ Tech Stack: • Frontend: HTML, CSS, JavaScript • Backend: Node.js, Express.js • API Communication: Axios • Deployment: Render ⚡ Key Learnings: • Handling REST APIs (GET, POST) • Managing state without a database • Debugging deployment issues (especially baseURL & API calls 😄) • Structuring a clean backend with routes This is just the beginning — next step is adding a database (MongoDB) and scaling this further. 🔗 Live App: https://lnkd.in/gkBQ99yr Harsh tripathi Arpit Sarda Varun Kohli Kartik Mathur Aditya Prasad Satyam Kumar
To view or add a comment, sign in
-
The Learning Progress (MERN Stack) Goal: Show consistency and your growth into Backend development. From Frontend to Full-Stack: The Node.js Chapter. 🛠️ Mastering React was just the beginning. Recently, I’ve been diving into the "hidden" side of the web: The Backend. Moving from UI components to handling RESTful APIs and MongoDB schemas has been a game-changer. My biggest takeaway so far? Security and Scalability. Currently focusing on: ✅ JWT Authentication for secure user sessions. ✅ Efficient MongoDB indexing to speed up queries. ✅ Error handling middleware in Express.js. It’s a steep learning curve, but seeing the data flow from the database to a React component I built is an incredible feeling. What was the hardest part of the backend for you to wrap your head around? For me, it was definitely async/await logic! 😅 #NodeJS #FullStack #MERN #LearningToCode #WebDeveloper
To view or add a comment, sign in
-
Today I challenged to build a mini full-stack feature 🚀 🔹 Frontend (React) learnings: • Managed form inputs efficiently using useState • Used useEffect to fetch data from backend APIs • Implemented handleChange & handleSubmit for smooth form handling • Integrated API calls using axios • Added basic validation → if fields are empty, it shows a popup like “Please enter all fields” ⚠️ • Ensured real-time updates by displaying fetched data on the UI 🔹 Backend (Node.js & Express): • Built RESTful APIs using Node.js & Express • Connected database using MongoDB with Mongoose • Created a POST API to store user input data • Created a GET API to retrieve stored data • Handled request/response flow between client and server ✨ End-to-end flow: ➡️ User enters data in the form ➡️ Data is sent to backend via API call ➡️ Stored securely in MongoDB ➡️ Backend fetches the data ➡️ Frontend displays it dynamically 💡 This small challenge gave me a clear understanding of the complete data flow in a MERN stack application — from user input → API → database → UI. #ReactJS #NodeJS #ExpressJS #MongoDB #MERN #FullStack #WebDevelopment #LearningByDoing #100DaysOfCode #Frontend #Backend #Axios #JavaScript #CodingJourney
To view or add a comment, sign in
-
Why Next.js 16, React 19, and TypeScript? When we started Luclair Vision, the first decision was choosing the right technologies. This wasn't arbitrary, it was strategic. Why Next.js 16.2? Next.js 16 released with revolutionary features we couldn't ignore: 1️⃣ App Router: Organizing routes by feature-folders instead of flat files = cleaner codebase as we scale. 2️⃣ Server Components: Let us keep sensitive logic (API calls, database queries) server-side, reducing bundle size. 3️⃣ Built-in API Routes: Why spin up a separate Express server? We get /api/* routes natively. 4️⃣ Image Optimization: Automatic optimization for our Cloudinary images. 5️⃣ Streaming Support: Critical for our Gemini AI features where we needed real-time text streaming. Why React 19? React Compiler = Less manual memoization needed Better TypeScript support out of the box Improved error handling and debugging Integrates perfectly with Next.js server actions. Why TypeScript? With 11 database tables and complex data flows, TypeScript was NON-NEGOTIABLE. If a developer tries to create a product without a required field, the compiler catches the mistake at build time. No runtime surprises. The Rest of the Foundation: 🗄️ Database (PostgreSQL via Supabase): Perfect for flexible product metadata. Built-in auth saved us hours of development time. Styling (Tailwind CSS): Consistent spacing and custom luxury brand colors defined once and used everywhere. The Lesson? Technology selection isn't about using the "latest and greatest" - it's about choosing tools that: ✓ Solve your specific problem efficiently. ✓ Have strong community support. ✓ Scale with your ambitions . ✓ Your team understands deeply. We could've used plain React + Express + MongoDB. We'd have shipped faster initially. But considering the complexity (e-commerce logic, AI integration, shipping APIs), Next.js + TypeScript + PostgreSQL was the RIGHT choice for long-term maintainability. What's YOUR go-to stack for commerce platforms? Have you ever had to switch technologies mid-project? #WebDevelopment #NextJS #ReactJS #TypeScript #SoftwareArchitecture #Ecommerce #FullStack #LuclairVisionBuild
To view or add a comment, sign in
-
-
🚀 Still not using APIs in your projects? You’re falling behind. If you're serious about backend development, fintech, or trading systems, learning how to build a REST client is non-negotiable. This hands-on guide from TraderMade shows exactly how to build your first server-side JavaScript REST client using Node.js 👇 🔗 https://lnkd.in/gdTC4-_g 💡 What makes this worth your time? • No fluff — straight into real implementation • Learn how to fetch live Forex & CFD market data • Use tools like Axios to handle API requests efficiently • Understand how real-world data flows into applications ⚡ Why this actually matters: APIs are the backbone of modern apps. Whether you're building: 📊 Trading dashboards 📈 Data-driven platforms 💻 Scalable backend systems 👉 You need to know how to connect, pull, and use live data — not just design the frontend. Most tutorials stop at “hello world.” This one gets you closer to building something real.
To view or add a comment, sign in
-
Building scalable applications is not just about writing code… It’s about writing the right logic 💡 While working with Node.js, I learned: ✔ Business logic matters more than syntax ✔ Real-world problems need real solutions ✔ Clean structure = scalable system From payment allocation to journal entries — every line of code should solve a problem 🚀 #NodeJS #BackendDevelopment #BusinessLogic #FullStackDeveloper
To view or add a comment, sign in
-
Explore related topics
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development