Note: contributions to the code here are more than welcome
I am the sort of person who gets random ideas at random times. This project started with one of those ideas.
The Idea
I'm going to build a web app using Next.js that overlays user-defined text on top of an user-defined image. The images are each going to be a 'design', and each design will be able to be published. So basically, Canva but it's simpler, more focused and of course, completely free and open source. Because paid stuff mostly sucks.
The frameworks and libraries
Storing all the designs in local storage wouldn't be enough, and I wanted an easy-to-implement, free OAuth login (sign in with Google, Github etc). Then, after a bit of googling I found NextAuth.js.
I decided to use Prisma to simplify the database models, and connected that to NextAuth. I used Mantine for the frontend components because:
Bootstrap doesn't look good without modifying half the CSS - the website doesn't have that 'pop'.
Tailwind requires too much work and isn't a component library anyway.
There are many other component libraries but Mantine is the most professional-looking one that I managed to find yet. It's also quite easy to work with.
That being said, I'll be explaining the rest of it in the next episode (if I manage to make one).
Top comments (0)