Skip to content

This website allows users to create and view blogs. The website also allows users to filter/search blogs by author id. The website is primarily built in TypeScript. The frontend is built using Next.js and the backend is built using Node.js and Express. Used Prisma as ORM for database interaction with Postgres db.

Notifications You must be signed in to change notification settings

omkargade04/Blog-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 

Repository files navigation

Blog App

Blog app is a application where users should be authenticated and post blogs. The application allow users to view all the blog posts and filter/search blogs of specific author's blog by his/her author ID.

Description

In this application, users can publish and view their blogs. The application also allows users to filter blogs posts by author's author ID.

Features

  1. User Registration: Users can sign up by providing their name, email, and password.
  2. User Login: Existing users can log in to their account using their email and password.
  3. Data fetching: Data is fetched on the homepage and search author page using server-side rendering.
  4. Blog Viewing: Users can access all blogs on the homepage and their personal blogs on dashboard.
  5. Blog Filtering/Searching: Users can filter/search specific author's blog by author ID.
  6. Protected Routes: Only logged-in users can access the homepage, dashboard and create blogs.
  7. Used Prisma as ORM to interact with Postgres database and to store the data in db.

View website

Here is the deployed website : Deployed Link
Here is the deployed backend server: Backend Link;

Installation

To install and run this project locally, add the following commands in your terminal, follow these steps:

  1. Clone the repository from GitHub:

    `git clone https://github.com/omkargade04/Blog-App.git`
    
  2. Navigate into the project directory:

   `cd Blog-App`
  1. Navigate into client:
   `cd client`
  1. Navigate into server:
   `cd server`

Important

  1. Ensure that the version of Node.js and npm you're using is compatible with the dependencies you're installing. Some dependencies may require specific Node.js versions. Run the below command in client directory and server directory.
   `npm install -g npm@latest`
  1. Install dependencies for the frontend in client directory (assuming you have Node.js and npm installed):
   `npm install`
  1. Install dependencies for the backend in server directory (assuming you have Node.js and npm installed):
   `npm install`
  1. Install prisma for the database ORM in server directory
   `npx prisma init`
  1. Setup the database by running the migration command
   `npx prisma migrate dev --name init`
  1. Create a .env file in the client directory and add backend api endpoint:

NEXT_PUBLIC_BASEURL=http://localhost:5000 (for local server)

NEXT_PUBLIC_BASEURL=https://blog-app-n9f2.onrender.com (for deployed server)

  1. Create a .env file in the server directory and connect your database with prisma via database url:

PORT=5000
DATABASE_URL=postgresql://<user>:<password>@localhost:5432/<db_name>?schema=public
TOKEN_SECRET=your-token

  1. Start the frontend and backend servers:

    server: npm run dev
    client: npm run dev

  2. Open http://localhost:3000 to view the application.

Run the project via Docker

Prerequisites

  • Docker

For Linux System:

To install Docker, run the following commands in your terminal:

curl -fsSL https://get.docker.com -o get-docker.sh
sudo sh get-docker.sh

Development Environment For Server

  • Navigate into server directory
  • To get started with development first build the dev containers using the following command
docker-compose -f docker-compose-server.yaml build
  • The env file being used for development is called .env
  • Run the containers using the command
docker-compose -f docker-compose-server.yaml up

Development Environment For Client

  • Navigate into client directory
  • To get started with development first build the dev containers using the following command
docker-compose -f docker-compose-client.yaml build
  • The env file being used for development is called .env
  • Run the containers using the command
docker-compose -f docker-compose-client.yaml up

About

This website allows users to create and view blogs. The website also allows users to filter/search blogs by author id. The website is primarily built in TypeScript. The frontend is built using Next.js and the backend is built using Node.js and Express. Used Prisma as ORM for database interaction with Postgres db.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages