Talent Trade is a platform for exchanging knowledge and skills between people. It connects those who want to learn something new with those willing to share their expertise. Users can create detailed profiles with contact information, photo, specialty, and a brief personal description, facilitating connections between people with complementary interests.
There are existing applications that allow you to connect with people for some specific purpose. Take Tandem as an example for language exchange or Couchsurfing for connecting travelers with hosts.
Our application aims to pair up people from a wide gamut of fields and specialties and allow for interaction between them so that they can exchange their knowledge and, additionally, see the chance of building a connection.
We make sure you're paired up with the right person by making sure your interests and specialties match with the other individual's interests and specialties.
Catriel knows HTML, CSS, and JavaScript, but he wants to improve his English. Owen is a native English speaker who wants to learn web development. They both hear about Talent Trade, give it a try and meet on that platform. Given that their specialties and interests match, they arrange a session to exchange knowledge, benefiting each other.You have the possibility of getting suggestions about exchange partners with complementary interests
As soon as you've finally exchanged some knowledge with your exchange partner, you have the chance to rate them and express what that interaction was like.
You can let others know about your personality! You can tell what your interests are, your own avatar, and a section that tells about you
When you're paired up with your exchange match, you can send messages to each other and let the communication flow. This chat is open up to 7 days.
The technologies used to build this project are the following:For our frontend, we opted for Next.js, which made routing pretty straightforward, and Tailwind CSS, which has predefined classes and lifts off styling overhead
For the backend side, we opted for Express.js (a lightweight framework good enough to get the work done) and TypeScript for enforcing correct type matching and custom interfaces for our database models. Mongoose came in handy for querying data to the database with built-in functions.
For persistent data storage, we opted for MongoDB with MongoDB Atlas, which allows us to store data in the form of documents; pretty flexible for data schemas.
- Node.js (version 20 or higher)
- Git
- MongoDB installed locally or a MongoDB Atlas cluster (Atlas UI)
1. Clone the repository:
git clone https://github.com/No-Country-simulation/c19-05-ft-node-react.git
2. Go to backend directory and install dependencies. If you have a package manager different from NPM, you can run yarn install for Yarn or pnpm install for pnpm instead of npm install.
cd backend
npm install
3. Make a .env file by taking the template provided in .env.template
cp .env.temmplate .env
4. Fill the necessary data in your .env file. You can use a code editor such as Visual Studio Code, Sublime Text, or Vim.
# base datos
DATABASE_URL =
FRONTEND_URL =
SERVER_URL =
# nodemialer
SMTP_HOST =
SMTP_PORT =
SMTP_USER =
SMTP_PASS =
PORT = 4000
COOKIE_SECRETKEY = cookiesecret
JWT_SECRET = jwtsecret
BCRYPT_SALT = 10
#Gmail
GOOGLE_CLIENT_ID =
GOOGLE_CLIENT_SECRET =
GOOGLE_CALLBACK_URL =
#Upload Avatar
CLOUDINARY_URL=
CLOUDINARY_NAME =
CLOUDINARY_KEY =
CLOUDINARY_SECRET =
You can get the database URL either by your local server (might look something like mongodb://localhost:27017) or a database created in your MongoDB Atlas cluster (which might look something like mongodb+srv://username:[email protected]/?retryWrites=true&w=majority&appName=Cluster0)
Make sure you add the correct URI for the frontend so that there are no CORS issues. Trying it locally, we can add http://localhost:3000 as our URI for the frontend.
Regarding to the SMTP_ variables, you can create an account on Mailtrap and you get the credentials from there.
5. Run the backend
npm run dev
If you run it locally, you'll get your backend running on http://localhost:PORT/, where PORT is the port you defined on your .env file. To get a quick overview of the available endpoints, you can refer to the API documentation.
6. Open another terminal on the root of the project. If you opened the project with Visual Studio Code, you can open another terminal on the button at the top right and you'll get located on the root of it, just as indicated on the image below:
7. Go to the frontend folder and install dependencies. If you have a package manager different from NPM, you can run yarn install for Yarn or pnpm install for pnpm instead of npm install.
cd front
npm install
8. Run the frontend
npm run dev
9. Open the http://localhost:3000 URL on your web browser.
And voilà! You have your application running. :)
