Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/crist-pereyra/stack-overflow-clone
https://github.com/crist-pereyra/stack-overflow-clone
Last synced: about 11 hours ago
JSON representation
- Host: GitHub
- URL: https://github.com/crist-pereyra/stack-overflow-clone
- Owner: crist-pereyra
- Created: 2024-04-18T01:52:58.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-05-28T02:41:46.000Z (5 months ago)
- Last Synced: 2024-05-28T12:29:40.720Z (5 months ago)
- Language: TypeScript
- Size: 2.64 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Dev Overflow 📚
## 🌐 Live Demo
Explore the live demonstration of the project: [nextjs14-dev-overflow](https://stack-overflow-clone-amber.vercel.app/)
Welcome to the Dev Overflow project! This is a modern, intuitive, and feature-rich clone of Stack Overflow built with the following awesome technologies:
⚡ **Next.js 14** for server-side rendering and static site generation
⚛️ **React with TypeScript** for a robust and scalable frontend
🎨 **Tailwind CSS** for beautiful and customizable UI components
🔒 **Clerk** for authentication and user management
🛠️ **ESLint and Prettier** for code quality and consistency
🖌️ **Shadcn/ui** for UI components
📝 **TinyMCE** for rich text editing
📂 **MongoDB and Mongoose** for database management
🌈 **PrismJS** for syntax highlighting
📏 **Zod** for schema validation
## 🚀 Getting Started
Follow these steps to get the project up and running on your local machine.
### Prerequisites
- Node.js (version 14 or later)
- npm or yarn
- MongoDB
### Installation
1. Clone the repository:
```sh
git clone https://github.com/crist-pereyra/stack-overflow-clone
cd stack-overflow-clone
```
2. Install dependencies:
```sh
npm install
```
### Running the Development Server
1. Start the development server with the following command:
```sh
npm run dev
```
2. Open your browser and navigate to http://localhost:3000 to see Dev Overflow in action!
## 📂 Project Structure
Here's an overview of the project's structure:
```php
dev-overflow/
├── app/ # Source code
│ ├── (auth)/ # Log In/ Sign In pages
│ ├── (root)/ # Main Pages
│ ├── api/ # Endpoints
│ ├── globals.css # CSS style
│ └── layout.tsx # Main Layout
├── components/ # React components
├── constants/ # Constant values
├── context/ # Context providers
├── database/ # Database interactions
├── lib/ # Library functions
├── public/ # Public assets
├── styles/ # CSS styles
├── types/ # TypeScript types
├── .eslintrc.json # ESLint configuration
├── .gitignore # Git ignore file
├── README.md # Project documentation
├── components.json # Components metadata
├── middleware.ts # Middleware configuration
├── next.config.mjs # Next.js configuration
├── package-lock.json # Lock file for npm
├── package.json # Project metadata and scripts
├── postcss.config.mjs # PostCSS configuration
├── tailwind.config.ts # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
```
## 🛠️ Key Features
- **Authentication**: Secure user authentication and management with Clerk.
- **Rich Text Editing**: Create and edit content with TinyMCE.
- **Syntax Highlighting**: Beautiful code display using PrismJS.
- **State Management**: Efficient state management with Search Params in Next.js 14.
- **Type Safety**: Benefit from TypeScript's type-checking to minimize errors.
- **Schema Validation**: Robust input validation with Zod.