Full Stack Open Solutions

This repository contains my solutions to the Full Stack Open course by the University of Helsinki.
The course focuses on building single-page web applications (SPAs) with React that communicate with RESTful and GraphQL backends.
Along the way, it covers modern web development tools and practices such as Redux, Node.js, MongoDB, TypeScript, testing, and containerization.

Currently working on: Part 11 – CI/CD

📝 Course Progress

• ✅ Part 0 – Fundamentals of Web apps
• ✅ Part 1 – Introduction to React
• ✅ Part 2 – Communicating with server
• ✅ Part 3 – Programming a server with NodeJS and Express
• ✅ Part 4 – Testing Express servers, user administration
• ✅ Part 5 – Testing React apps
• ✅ Part 6 – Advanced state management (Redux, React Query)
• ✅ Part 7 – React router, custom hooks, styling with CSS and webpack
• ✅ Part 8 – GraphQL
• ✅ Part 9 – TypeScript
• ⏳ Part 10 – React Native
• 🚧 Part 11 – CI/CD
• ⏳ Part 12 – Containers
• ⏳ Part 13 – Using relational databases

📁 Repository Structure

Each course part has its own folder with the respective exercises.

⚡ Skills & Tools Learned

Frontend

• React (components, hooks, context, custom hooks)
• React Router
• State management with Redux and React Query
• Styling with CSS (styled components)

Backend

• Node.js with Express
• REST API implementation
• MongoDB with Mongoose
• GraphQL schemas, resolvers, and Apollo Server/Client

Other Tools & Practices

• Git & GitHub for version control
• Testing with Supertest and Playwright

🚀 Featured Projects

• 📱 Phonebook App (Part 2–3)
  Application for managing contacts, demonstrating CRUD operations and server communication.

  • ⚙️ Backend: Node.js, Express, MongoDB
  • 💻 Frontend: React
  • 🌍 Deployed live for testing and demonstration
  • 🔗 Live Demo | Deployment Repository

• 📝 Bloglist App (Part 4–5)
  Blogging platform with user authentication, authorization, and testing.

  • ⚙️ Backend: Node.js, Express, MongoDB
  • 💻 Frontend: React
  • 🧪 Integration tests with Supertest and end-to-end tests with Playwright
  • 📁 Source Code:
    • Backend
    • Frontend

• 🛠️ Bloglist App Extensions (Part 7)
  Extended the Bloglist App with advanced frontend techniques.

  • 🟥 Redux version: state management with Redux, routing with React Router, styled-components for styling
  • 🔷 React Query + Context version: state management with React Query and Context
  • 🔍 Showcases comparing different approaches to frontend state
  • 📁 Source Code

• 💬 Anecdotes App (Part 6)
  Application for creating, voting on, and viewing anecdotes, implemented in multiple versions.

  • 🟥 Redux version: global state management with Redux
  • 🔷 React Query version: state management with React Query and Context/useReducer
  • 📁 Source Code

• 📚 GraphQL Library App (Part 8)
  A library management system demonstrating GraphQL integration on both backend and frontend.

  • ⚙️ Backend: Apollo Server with GraphQL schemas and resolvers
  • 💻 Frontend: React with Apollo Client for queries, mutations, and subscriptions
  • 🧩 Features user authentication, and real-time updates with GraphQL subscriptions
  • 📁 Source Code

• 🧾 Patientor App (Part 9)
  Medical records management application built with TypeScript.

  • ⚙️ Backend: Node.js, Express, fully typed with TypeScript
  • 💻 Frontend: React with TypeScript, leveraging strong typing for components and state
  • 📁 Source Code:
    • Backend
    • Frontend

🙏 Acknowledgements

This repository is based on the Full Stack Open course by the University of Helsinki.
Huge thanks to the course instructors and contributors for making such a comprehensive and free resource for modern web development.