Hey devs, welcome to this tutorial; we will build a real-time Todo App with React, Next.js + Firebase. — This is the video explanation of this article 👇 The full code of this project is available in this repository👇 TodoApp-Nextjs-Firebase View the code here of this to-do app. And Don’t forget to use the dark mode 😉github.com Before we start writing code, I want to tell you that I expect you to have basic knowledge of React and Next.js.

SSR with Clean URLs — Table of Contents Welcome to a series exploring Cloud Functions for Firebase with a modern application stack (React, Apollo, GraphQL, Next.js & Firebase). If you are not familiar with this stack, read on! If you are familiar, checkout the TOC above. What is Server-side Rendering? Most apps today are built as Single Page Applications…

First things first: what is Next.js? A small framework for server-rendered universal JavaScript webapps, built on top of React, Webpack and Babel. It comes out of the box with preconfigured features like routing, static optimization, server-side rendering, code splitting, CSS-in-JS support, hot reloading and API routes à la Express.js, Deployment…

Set a document When you use set() to create a document, you must specify an ID for the document to create. // Add a new document in collection "cities" db.collection("cities").doc("LA").set({ name: "Los Angeles", state: "CA", country: "USA" }) db.collection('cities').doc('BJ').set({ capital: true }, { merge: true }); Specify that the data should be merged…

What is Firebase? Google Firebase is a Google-backed app development platform that allows developers to create iOS, Android, and Web apps. Tools are available from Firebase for monitoring analytics, reporting and resolving app errors, as well as developing marketing and product experiments. HTML & CSS I am skipping the explanation of the HTML and CSS part…

Cloud Firestore is great for building internal apps because it handles all the complicated ins and outs of managing a database for you. In this tutorial, we’ll show you how to set up a basic CRUD app with the Cloud Firestore using the Node.js SDK: Set up the Cloud Firestore…