Skip to main content

Command Palette

Search for a command to run...

πŸŽ‰ Introducing Easy Pastes - Easiest way to create and share code pastes

Published
β€’4 min read
πŸŽ‰ Introducing Easy Pastes - Easiest way to create and share code pastes
U

I am a full stack developer, YouTuber and blogger!

✨ Introduction to the app

Easy Pastes is an app where users can easily paste some code they want to share with someone with syntax highlight and even if they want to make it public, they can do so to show other people.

It is the easiest and fastest way to share code pastes and most of the programming languages are supported. You can request to add a language on the GitHub repository.

This app is fully open-source for learners to learn and to encourage people to contribute to this project to make it better.

The app is live on easypastes.tk and open sourced on GitHub

Here is how you can use the app

Demo GIF

πŸ‘₯ The team

Sunrit Jana and I have been working on this app for the last fifteen days and it has been a great experience working with him!

🎨 How is the app built?

Easy Pastes is using the latest and greatest technologies! The tech stack for the app is

We are using Next.js for the whole app, Chakra UI for the user interface, Supabase for the database, and Clerk.dev for authentication.

🧐 Exploring the app

We'll be going into detail on how to use this app in this section. On the main page, you will be having the functionality to create a paste.

Sign in and sign up

The authentication system is powered by Clerk.dev which is awesome!

Before creating a paste, it's recommended to sign in because your pastes are stored for future use. And you can edit and delete your pastes while you are signed in. When you create a paste while signed in, it will be your paste. You can go to the My Pastes page to see what pastes you have created.

And Easy Pastes also has multi-account system so you can sign in with multiple accounts.

image.png

ℹ️ Public pastes are shown on the home page. Private pastes are private and no one can view them except the author Unlisted pastes can be viewed by anyone from the link but are not shown on the home page

Pick a language of your choice (default: none)

image.png

Give paste a title (optional)

image.png

Change visibility and give a custom URL (optional)

ℹ️ Making a custom URL and making paste private is only available when you are signed in.

If the custom URL is not specified, it'll be a randomly generated id, and the pastes are public by default.

image.png

Paste the code and click the create button

image.png

Share, copy, edit, or delete the paste

You will be redirected to your created paste which you can then share the link to someone, copy the code, delete and edit the paste.

image.png

🧱 PWA (new)

With the latest update, Easy Pastes is also a PWA and it can be installed and used as an app.

image.png

image.png

As a PWA, it also has shortcuts to directly open the My Pastes page

image.png

πŸ”‘πŸ”’ Password protection (new)

We're also now focused on security. We have added a feature consisting of protecting your pastes and storing the secure password hash in DB. No one other than you, or people can access it! This is one of the features we're really proud of!

Set a password using this button

image.png

And then visit the page where you would need to enter the password to view it

image.png

πŸ‘½οΈ Your profile

You can change your account settings by clicking your account button on the top right and settings. But in this case, you also get the functionality to view your own pastes.

When you click on the My Pastes link in the navbar, you will see your own pastes.

You can achieve this behaviour by simply setting the username in user settings else it will be the user id. image.png

On this page, you are able to view pastes you have created and you can even filter them by All, Public, Unlisted, and Private.

image.png

If the page is viewed by someone else, they will only be able to see the public pastes you have created.

image.png

πŸ’« Conclusion

And that is how Easy Pastes works! Thanks to Hashnode for organizing this hackathon. It helped me so much to build my first full-stack web application.

I want to thank the folks over at Discord and Twitter who helped me to improve this app by giving their valuable feedbacks.

The Clerk team on Discord was very helpful to us. They were very helpful whenever we had any queries regarding Clerk.

Sorry if I missed someone :)

Feel free to contribute to the project on the GitHub repository and give your suggestions and how the app works in the comments.

πŸ“ˆ Updates

27-07-2021:

  • With this commit , swears and bad words are filtered from the Title and Custom URL

28-07-2021

  • Made Easy Pastes a PWA
  • Custom 404 page

29-07-2021

  • We're here with another amazing update! Added password protection
  • Fixed the heading and footers.

02-08-2021

  • Viewing paste in raw mode feature

Comments (18)

Join the discussion
I
Ishrar G4y ago

Thank you Usman Sabuwala for Tagging me.

I never thought you will end up with such a wonderful thing. You have simplified the big problem and put it on a single page. Amazed after looking it.

The speed of the website is the advantage and the user likes to work with it.

Hope to see many new things.

Good Luck dude.

10
U

Thanks a ton for your kind words😊

A

I would just like to say:

Found what I was looking for

I have been using pastebin for a while, but I don't like the interface and it sometimes becomes slow for older pastes.

I really like the simplicity and the speed.

It would be great if you add the support for raw text (just like GitHub does).

You have also chosen a easy-to-remember domain. Please don't remove it.

16
U

Thank you so much for your kind feedback, Aditya! And the raw feature like GitHub will too come soon too!

2
U

Aditya Mitra Just wanted to inform that the feature for raw paste is available now

V
Vaibhav4y ago

Nice app! I also made something similar a while back. It is also open source. Check it out at https://codedump.xyz.

10
U

Thank you! Yes will check it out for sure and will contribute too if possible ✌️. The name is great tho

T

Awesome project πŸ™Œ

10
U

Thanks a lot πŸ™‚

C
Candy4y ago

Love the UI!

This is so beautiful!

10
U

Thank you so much!

V

Nice project! Very creative and it looks fantastic! Congrats to you and Sunrit for finishing it so well 😍

10
U

Thank you Victoria Lo! I guess we still have time till 23:59 PT so we're working on another feature πŸ˜‰.

Done with that! Now we can set passwords for pastes

Y
Yuvaraj4y ago

Loved the App. UI looks awesome. Well done @usmanwrites πŸ‘

10
U

Thank you so much YuvarajπŸ˜‰

E

What a great idea! This could be so useful!! Thanks for creating it Usman Sabuwala :)

10
U

Nice to hear that πŸ˜€!

image.png

V

Good application, this will be a handy tool for the developers

10
G

Wow! you took it to next level buddy! awesome

10
U

Glad to know that brother πŸ˜„

More from this blog

U

Usman Writes

30 posts

Hey all! My name is Usman! I am 17 years old and learning web development and programming. I also have a YouTube channel on the subject of programming and mostly web development.