Cheathub
Web app for organizing code snippets, with Flask/Python backend, with React/Typescript frontend
Overview
The project is a clean monorepo with a Flask/Python backend API and a React/Typescript frontend. It serves as a library of user-created code snippets with features for organizing, searching, and interacting with snippets. The project aims to provide a platform for users to create and manage their own code snippets and collections.
Features
- User Registration: New visitors can register for an account.
- User Login: Returning visitors can securely log in to their account.
- Create Code Snippet: Returning visitors can create their own code snippets.
- View Code Snippet: Returning visitors can view their code snippets.
- Edit Code Snippet: Returning visitors can edit their code snippets.
- Delete Code Snippet: Returning visitors can delete their code snippets.
- Create Collection: Returning visitors can create collections of code snippets.
- View Collection: Returning visitors can view their collections of code snippets.
- Edit Collection: Returning visitors can edit their collections of code snippets.
- Delete Collection: Returning visitors can delete collections of their code snippets.
- Search Code Snippets: Frequent visitors can search for code snippets they have created.
- Search Others' Code Snippets: Frequent visitors can search for code snippets created by others.
- Favorite Code Snippets: Frequent visitors can like/fave code snippets created by others.
- View Favorite Code Snippets: Frequent visitors can view their favorite code snippets created by others.
- Unfavorite Code Snippets: Frequent visitors can unlike/unfave code snippets they have previously liked.
- Copy Code Snippets: Frequent visitors can copy code snippets to the clipboard.
- Delete Account: Frequent visitors can delete their account.
Summary
The project is a monorepo with a Flask/Python backend API and a React/Typescript frontend. It provides a platform for users to create, manage, and search code snippets and collections. The project includes features for user registration, login, code snippet creation, editing, and deletion, collection creation, editing, and deletion, code snippet searching, favoriting, and copying, and account deletion.
- Create React App
Create React App is a popular tool for quickly setting up a new React project without the need for manual configuration or setup. It provides a preconfigured development environment with modern build tools, a live development server, and an easy-to-use command line interface.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Chakra UI
Chakra UI is a popular open-source React component library that provides a set of accessible and customizable UI components to help developers create modern web applications.
- Framer Motion
Alpine.js is a lightweight JavaScript framework that simplifies the process of creating dynamic, reactive user interfaces on the web. It uses a declarative syntax that offers a higher level of abstraction compared to vanilla JavaScript, while being more performant and easier to use than jQuery.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
- Vercel
Vercel offers built-in support for deploying and hosting Next.js applications, making it a popular choice among Next.js developers.