https://github.com/bjcarlson42/nextjs-with-firebase

NextJS boiler-plate with Google's Firebase integrated. Watch on YouTube: https://youtu.be/SYnu6CLKD70
https://github.com/bjcarlson42/nextjs-with-firebase

firebase firebase-auth firebase-boilerplate firebase-cloud-firestore firebase-database firebase-storage nextjs nextjs-boilerplate nextjs-firebase-boilerplate nextjs-starter nextjs-template

Last synced: about 2 months ago
JSON representation

NextJS boiler-plate with Google's Firebase integrated. Watch on YouTube: https://youtu.be/SYnu6CLKD70

• Host: GitHub
• URL: https://github.com/bjcarlson42/nextjs-with-firebase
• Owner: bjcarlson42
• Created: 2021-03-15T23:50:28.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2023-03-16T04:13:16.000Z (almost 2 years ago)
• Last Synced: 2024-10-11T10:50:27.311Z (2 months ago)
• Topics: firebase, firebase-auth, firebase-boilerplate, firebase-cloud-firestore, firebase-database, firebase-storage, nextjs, nextjs-boilerplate, nextjs-firebase-boilerplate, nextjs-starter, nextjs-template
• Language: JavaScript
• Homepage: https://youtu.be/SYnu6CLKD70
• Size: 227 KB
• Stars: 117
• Watchers: 2
• Forks: 58
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml

Awesome Lists containing this project

README

        
# Next.JS With Firebase Boiler Plate

![image of app](/public/readme-img.png)

This repo is a sample [next.js](https://nextjs.org/) project with [Firebase](https://firebase.google.com/) integration. I used `yarn create next-app` to bootstrap the project and I did not remove any of the starter files. Feel free to follow along with the YouTube tutorial [here](TODO) and check out the live website hosted on [Vercel](https://vercel.com/) [here](TODO).

This repo contains the followng actions implemented:

- Authentication

  - popup auth flow

  - email + password

  - Google OAuth

  - Twitter OAuth

  - GitHub OAuth

- Cloud Firestore

  - read (examples for all availible data types)

  - write

- Realtime Database

  - read

  - write

- Storage

  - Uploade a file (video, image, etc)

- React Bootstrap

  - React Bootstrap installed with minimal styling

This is not meant to be a tutorial on how to use next.js or Firebase, but simply how to connect the two and perform common actions. As always, refer to the docs whenever you might have questions: 

- [next.js](https://nextjs.org/docs/getting-started)

- [Firebase](https://firebase.google.com/docs/build)

This is compatable with next.js v10+ and Firebase JavaScript v8+, which are currently the newest versions. May work with older versions.