Code&Line

Code&Line is a note-taking app designed for developers to provide a more detailed understanding of their code. Its core feature allows users to target specific code lines with each note, aiming for a line-by-line explanation of the snippet.

Table of Contents

• Development Setup
  • Setting up Frontend
  • Setting up Backend
  • Running Tests
• Contributing
• Ideas for Improvement
• Resources
• License

Development Setup

To clone and run this project, you'll need Git and Node.js (which comes with npm) installed on your computer.

Setting up Frontend

1. Clone frontend repo

git clone https://github.com/brrkrmn/codeandline-frontend.git

2. Go into the repo

cd codeandline-frontend

3. Install dependencies

npm install

4. Run the app

npm start

Setting up Backend

1. Clone the repo

git clone https://github.com/brrkrmn/codeandline-backend.git

2. Go into the repo

cd codeandline-backend

3. Install dependencies

npm install

4. Initialize your MongoDB database manually
5. Set up environment variables
   • Create .env file in the root of the project
   • Include the following variables in your .env

   PORT = 3001
   MONGODB_URI = <your mongodb uri>
   TEST_MONGODB_URI = <your test database uri>
   SECRET = <your secret>

6. Run the server

npm run dev

Running Tests

npm test

Contributing

Code&Line is an open-source project, and your help is always welcome! I encourage you to go through the Contribution Guidelines and check out the Ideas for Improvement section.

Ideas for Improvement

• Display verification modal on delete (folders and notes)
• Password reset
• Profile page
• Add other authentication
• Add Light theme
• Add tests
• Auto save (folders and notes)
• Public notes and folders
  • upvoting
  • explore page

Resources

• Landing Page Animations
  • Framer Motion - useTransform docs
  • Framer Motion - useScroll docs
• Code Editor Styling and Events
  • Code Mirror ClassName Extension
  • Code Mirror Events Extension
  • Code Mirror styling docs
  • Code Mirror custom gutter
• Text Editor
  • React Quill docs

License

Licensed under the MIT License.