Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/iamrishupatel/devlog
DevLog is blogging platform for developers. This app is built with Next.js and Firebase and is loosely inspired by Dev.to
https://github.com/iamrishupatel/devlog
blog blogging-platform blogging-site firebase javascript nextjs react reactjs seo-friendly
Last synced: 4 months ago
JSON representation
DevLog is blogging platform for developers. This app is built with Next.js and Firebase and is loosely inspired by Dev.to
- Host: GitHub
- URL: https://github.com/iamrishupatel/devlog
- Owner: iamrishupatel
- License: mit
- Created: 2022-02-10T19:48:22.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-09-15T15:22:20.000Z (5 months ago)
- Last Synced: 2024-10-10T19:32:03.779Z (4 months ago)
- Topics: blog, blogging-platform, blogging-site, firebase, javascript, nextjs, react, reactjs, seo-friendly
- Language: JavaScript
- Homepage: https://devlog.rlabs.dev
- Size: 1.49 MB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Devlog
Devlog is blogging platform for 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://thedevlog.vercel.app) or [here](https://devlog.rlabs.dev)
## 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/iamrishupatel/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/)