Build a Full Stack Fiverr Clone with Next.js, Tailwind CSS, Node.js, PostgreSQL, Prisma & Kinsta
Fiverr is a popular platform for freelancers to offer their services and for entrepreneurs to find the right talent for their projects. In this article, we will learn how to build a full stack Fiverr clone using some of the most modern web development technologies.
First, we will use Next.js, a popular React framework for building server-side rendered and statically generated web applications. Next.js provides a great developer experience and is well-suited for building complex web applications.
For the frontend styling, we will use Tailwind CSS, a utility-first CSS framework that allows us to quickly build custom designs without writing any CSS. Tailwind CSS is highly customizable and easy to work with, making it a great choice for building the UI of our Fiverr clone.
On the backend, we will use Node.js, a popular JavaScript runtime for building server-side applications. Node.js is known for its performance and scalability, making it a great choice for building the backend of our Fiverr clone.
For the database, we will use PostgreSQL, a powerful open-source relational database system. PostgreSQL is known for its reliability, robustness, and feature set, making it a great choice for storing the data of our Fiverr clone.
To interact with the database, we will use Prisma, a modern database toolkit for Node.js and TypeScript. Prisma provides a type-safe and auto-generated query API, making it easy to work with databases and keeping our codebase clean and maintainable.
Finally, we will host our Fiverr clone on Kinsta, a premium managed WordPress hosting provider. Kinsta provides high-performance hosting with a focus on security and scalability, making it an ideal choice for hosting our full stack web application.
By following this article, you will learn how to build a full stack Fiverr clone using some of the most modern web development technologies, including Next.js, Tailwind CSS, Node.js, PostgreSQL, Prisma, and Kinsta. You will gain valuable experience in building complex web applications and working with a wide range of technologies, setting you up for success in your web development career.
Can u implement escrow payment?
anyone having this same error ?
xhr.js:256
POST http://localhost:3000/undefined/api/auth/signup 404 (Not Found)
Please implement mobile responsiveness @Kishan
Bro next js have already a back-end then why are you using node js
Nice video, I like your tutorials and it is very handy when you don't use TypeScript (I am not sure why people use Typscript, it makes everything more complex). Can you update this tutorial by using NextJs @latest app directory instead of SRC and use an easy databse backend like AirTable, or open source backend like nocodb? Also, with NextJs fetching function we don't need to use Axios, right? Thanks,
Hello Kishan does this includes the admin dash
Error : p1001 : cant reach database server At localhost:5432
hey can you teach all the tech stack indivaidlualy what matters because i only know ndoe js basics so how to be full stack engineer in less time thats my goal
Hello, I am following this project to build my own version on fiverr clone. But I am facing a problem with the localhost.
When setting up prisma, there is an error coming up
"Error:P1000; Authentication failed against database server 'localhost', the provided database credentials for 'db_name' are not valid.
Can you please help me with it
Thank You
im getting a 403 forbiden error when I try to create a gig, what could be the problem
good day, followed the whole tutorial, it's amazimg but if I login the navbar is disappearing, what could be the problem
where is the video about hosting PostgresSQL ??
Hi bro….I followed this project from the beginning to the end.
1 I used App router instead of page router
2 i installed packages with npm install
3 i run codes with npm run dev on client and npm start on server.
the project worked fine as yours. But I am having issues with deployment on kinsta.I followed exactly ur steps for deployment.
client start command: cd client && npm run build && npm run start
server run command: npm run server
I used the same environment variables as yours
below is the error I am getting.
upstream connect error or disconnect/reset before headers. reset reason: connection failure, transport failure reason: delayed connect error: 111
or
503 Service Temporarily Unavailable..
pls help out
can we deploy it on vercel
wadafaq your video quality at 1080p is sheeeeet
How import prismaclient works for you? It gives me named export error as we are using module export. It says that it is commonjs export
awesome
hi @Kishan i am having problem with kinsta hosting i am getting cors error on logging in what is the name of variable? in PUBLIC_URL or ORIGIN in your server code u have added process.env.ORIGIN what should i name vaiable in kinsta ???
can you show me how to run the program fully by clone the github repo?
Impressive sir, can you provide taskRabbit clone too just similar to this. Just to remark as an idea.tnx