This application allows users to manage code snippets efficiently. Users can create, edit, delete, and view code snippets through a user-friendly interface.
- Create: Users can create new code snippets by providing a title and the code itself.
- Edit: Existing code snippets can be edited to update the title or modify the code.
- Delete: Users can remove unwanted code snippets from the application.
- View: All code snippets are listed on the main page, and users can view each snippet individually.
- Next.js: The frontend is built using Next.js, providing server-side rendering and efficient routing. This project is taken from the course "Next JS: The Complete Developer's Guide" by Stephen Grider.
- Tailwind CSS: Styling is done using Tailwind CSS, allowing for rapid UI development.
- Prisma: Prisma is used as the ORM for interacting with the database, making it easy to manage database operations.
- Monaco Editor: The code editor is implemented using the Monaco Editor, providing syntax highlighting and code editing capabilities.
- SQLite: SQLite is used as the database to store code snippets.
- Clone the repository:
git clone https://github.com/Karl-Horning/snippets - Install dependencies:
npm install - Run the development server:
npm run dev - Open http://localhost:3000 to view the application in your browser.
- Create a Snippet: Click on the "New" button to create a new code snippet. Provide a title and the code, then click "Create" to save it.
- Edit a Snippet: Click on the snippet title to view the details. From there, click "Edit" to modify the title or code. Click "Save" to apply the changes.
- Delete a Snippet: On the snippet details page, click "Delete" to remove the snippet from the application.
- View Snippets: All snippets are listed on the main page. Click on a snippet title to view its details and code.
This project is licensed under the MIT License - see the LICENSE file for details.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent