Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/raselshikdar/devlog
devlog.rweb.site is a blogging platform for the developers. This website is built with Next.js and Firebase and is loosely inspired by Dev.to blog
https://github.com/raselshikdar/devlog
dev-to firebase firebase-auth firebase-database firestore javascript nextjs
Last synced: about 1 month ago
JSON representation
devlog.rweb.site is a blogging platform for the developers. This website is built with Next.js and Firebase and is loosely inspired by Dev.to blog
- Host: GitHub
- URL: https://github.com/raselshikdar/devlog
- Owner: raselshikdar
- License: mit
- Created: 2024-09-04T08:00:16.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-09-16T04:21:31.000Z (3 months ago)
- Last Synced: 2024-09-17T01:33:51.483Z (3 months ago)
- Topics: dev-to, firebase, firebase-auth, firebase-database, firestore, javascript, nextjs
- Language: JavaScript
- Homepage: https://devlog.rweb.site
- Size: 1.52 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Devlog
Devlog is a blogging platform for the developers built with Next.js and Firebase and is loosely inspired by Dev.to
Sign up for an 👨🎤 account, ✍️ write posts, then 💖 heart and ✍ comment on content created by other users. All public content is server-rendered and search-engine optimized.
> Visit Devlog [here](https://devlog.rweb.site) or [here](https://devlog.rasel.us.kg)
## Features
- 🔐 Authentication
- Google OAuth
- Facebook OAuth
- Github OAuth
- Blogging
- ✍ Write your blog
- 🗞 Update your blog
- 📖 Read blogs written by othes
- 💀 Delete your blog
- 💞 Realtime hearts
- 👨💻 Realtime comments
- 🔫 Reply on comments
- 📂 Image file uploads
- 📰 Bot-friendly content (SEO)
- 👨🎤 Custom Firebase usernames
## Tech stack
- React
- NextJs
- Firebase
## Running Locally
There are some prerequisites to run the app successfully on your local machine, follow the below steps to get started
### Prerequisites
- [Node](https://nodejs.org/en/) `16` or higher
- [npm](https://www.npmjs.com/) `8.5.0` or higher
Run the below commands in your terminal to confirm that all the requirements are passed to run the project Locally
- `node -v`
- `npm -v`
All the above commands should execute successfully and output the version numbers specified
### Project setup
**Clone the project repository**
```
git clone https://github.com/raselshikdar/devlog.git
```
**Navigate to the project directory**
```
cd devlog
```
**Install Dependencies**
```
npm install
```
#### Firebase Setup
Complete the proces to create a firebase project and register a web app,
and initialize Authentication, Firestore and Storage Services
**_Environment Variables_**
- Create a file name `.env.local` in the root directory of your project
- Browse to your firebase project settings, by clicking on the gear or cog icon in the left sidebar
- In the general setion of project settings, scroll down until you find `firebaseConfig` object with some project credentials
- Now fill your `.env.local` with the values from `firebaseConfig` object in your firebase project settings
- All enviornment Variables in `.env.local` 👇
- NEXT_PUBLIC_FIRE_API_KEY=
- NEXT_PUBLIC_FIRE_AUTH_DOMAIN=
- NEXT_PUBLIC_FIRE_PROJECT_ID=
- NEXT_PUBLIC_FIRE_SB=
- NEXT_PUBLIC_FIRE_MESSAGE_SENDER_ID=
- NEXT_PUBLIC_FIRE_APP_ID=
- NEXT_PUBLIC_FIRE_MEASUREMENT_ID=
**_Authentication Setup_**
- To perform authentication via google enable the sign in provider from the Authentication tab of fireabase console.
- You can follow this [guide](https://firebase.google.com/docs/auth/web/facebook-login) for authentication via facebook
- You can follow this [guide](https://firebase.google.com/docs/auth/web/github-auth) for authentication via github
Now that all requirements are in place lets start our servers
Run `npm run dev` to start client on port 3000
🥳 Hurray! you made it, go ahead to localhost:3000 to see the project in action
## License
[MIT](https://choosealicense.com/licenses/mit/)