Full-Stack Blog Application with MongoDB

🚀 Requirements

• Git

  git --version

• Nodejs

  node --version

• Yarn instead of npm

  yarn --version

• AuthJS

   yarn add next-auth

MongoDB

• It NoSQL database management system.
• Unlike traditional relational databases like MySQL or PostgreSQL, MongoDB stores data in flexible, JSON-like documents

Features:

• Document-Oriented: Data is stored in flexible JSON-like documents, making it easier to represent complex hierarchical relationships.
• Scalability: MongoDB is designed to scale out horizontally, allowing you to distribute data across multiple servers easily.
• High Performance: It offers high-performance reads and writes, suitable for various types of applications.
• NoSQL: MongoDB is classified as a NoSQL database, meaning it does not use the traditional tabular structure found in relational databases.**

Setup Database

• Sign In on MongoDB
• Create Database
• Input IP Address (Your API or 0.0.0.0)
• Connect your MongoDB with Prisma

Prisma

• Open-source ORM (Object-Relational Mapping) tool for Node.js and TypeScript.
• It simplifies database access by providing a type-safe and intuitive way to interact with databases.

Setup Prisma

• Install Prisma

  yarn add prisma
  

• Initialize prisma file with the datasource provider

  npx prisma init --datasource-provider mongodb
  

• Edit DATABASE_URL on .env file based on connection string on MongoDB.

  mongodb+srv://alifzwan:<password>@cluster0.cpfzale.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0
  

• Model your data in the Prisma schema

  model User {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String?
  posts Post[]
  
  }
  
  model Post {
  id        Int     @id @default(autoincrement())
  title     String
  content   String?
  published Boolean @default(false)
  author    User    @relation(fields: [authorId], references: [id])
  authorId  Int
  
  }
  

• After you model your Prisma Scheme, make sure to push the scheme to database:

  npx prisma db push
  

• Explore the data in Prisma Studio

  npx prisma studio
  

Auth JS

• Make sure you edit your API for authentication

  import NextAuth from "next-auth"
  import GithubProvider from "next-auth/providers/github"
  
  export default NextAuth({
    providers: [
      GithubProvider({
        clientId: process.env.GITHUB_ID,
        clientSecret: process.env.GITHUB_SECRET,
      }),
    ],
  })

• Initialize your NEXTAUTH_URL and NEXTAUTH_SECRET on your .env file

Create your API depending on providers you seek. For my case i need google api for authentication

• Create OAuth client ID on Google Cloud and Service.
• You'll get your GOOGLE_ID and GOOGLE_SECRET.

Firebase

• We only utilise firebase for their storage for our upload function.