CodeDrop

Description:

CodeDrop is a web application designed to simplify the sharing of code snippets. Users can paste their code, set expiration times for automatic deletion, and share the snippets temporarily. This tool is ideal for quick collaborations and ephemeral exchanges, ensuring that shared code is accessible and manageable.

Initial Stage:

The project started with a basic setup, including:

SvelteKit for a modern, reactive frontend.
SQLite for initial database management.
Basic routing and minimal UI components.

Current Stage:

As of now, CodeDrop boasts a fully functional and visually appealing interface with the following features:

Responsive Navbar: Easy navigation across the platform.
Hero Section: Introducing users to the platform's features.
Footer: Provides essential links and information.
Improved "View Pastes" Section: Enhanced UI and added share options.
Migration to MongoDB+srv: For better scalability and performance.
Hosted on Vercel: Seamless deployment and accessibility.

Project Progress:

Over the past two days, our team has made significant progress through effective collaboration. We have made almost 21 pull requests to enhance the functionality and overall structure of our website.

Progress Timeline:

Day 1:

Project setup with SvelteKit.
Initial database configuration using SQLite.
Basic UI development including the navbar and hero section.
Implemented the +page.server.js file to handle server-side logic, including initializing the database connection.
Created the $lib/dataStore.js module to interact with the SQLite database, including functions to initialize the database and create tables.
Designed the +page.svelte file to handle client-side rendering, including displaying the form for creating new pastes.
Set up basic structure for SvelteKit endpoints to handle creating and fetching code snippets, including POST and GET endpoints.
Implemented basic Svelte components for submitting and displaying snippets.

Day 2:

Migrated the database from SQLite to MongoDB+srv.
Enhanced the "View Pastes" section and added share options.
Implemented the footer for better navigation.
Resolved various UI/UX issues to improve overall user experience.
Deployed the application on Vercel, accessible at CodeDrop Vercel.
Optimized the fetching mechanism and fixed an issue where the page was not displaying content due to a redirect to a random page.
Fixed several bugs and commented out the setInterval(deleteExpiredPastes, 60 * 1000); function from the API folder due to errors.
Updated the display UI within the id folder, integrated svelte-highlight library for automatic syntax highlighting.
Implemented a button to download text content as a PDF using jsPDF library, ensuring the exported PDF maintains text format and content integrity.
Added a copy-to-clipboard feature with feedback notifications using clipboard.js and svelte-french-toast.
Added a new button for sharing the current page link using the Web Share API with fallback handling for unsupported browsers.
Removed the encrypt paste button and password input area.
Added a browse folder section linked with the textarea.
Limited syntax highlighting to 3 programming languages.
Updated expiration options to include 'never'.
Enhanced UI for the select language button and textarea syntax highlighting.
Merged pull requests to optimize the fetching mechanism and resolve page display issues.

Issues Addressed:

Add Footer to CodeDrop Website: Implemented a footer to improve site navigation.
Add Hero Section to CodeDrop Website: Added a hero section to introduce the platform to users.
Add Navbar to CodeDrop Website: Developed a responsive navbar for easy navigation.
Improve "View Pastes" Section and Add Share Option on Landing Page: Enhanced the UI of the "View Pastes" section and added sharing options.
Migrate Database from SQLite to MongoDB+srv: Successfully migrated the database for better performance and scalability.

What's Working:

User-friendly interface for creating and viewing pastes.
Secure and temporary sharing of code snippets.
Efficient database management with MongoDB+srv.
Seamless hosting on Vercel for global accessibility.

Overall, CodeDrop is now a robust platform ready for quick and secure code sharing, thanks to the concerted efforts and rapid development during the hackathon.

Links:

Demo Video Link: https://youtu.be/b1F6seHhfDo
GitHub Repository Link: https://github.com/onkar69483/CodeDrop
Live Demo on Vercel: https://codedrop.vercel.app

We hope CodeDrop serves as a valuable tool for developers looking for an efficient way to share their code snippets. Thank you for your attention and consideration.