LocaLink 🔗

Connecting cultures, let's be honest - it's not easy. But it's not impossible either. We're here to help you with that.

Let's be honest, the best knowledge about a culture is from the people of the culture, not from a book or a movie. We're here to help you connect with locals from all over the world.

How does it work?

1. You sign up for LocaLink
2. Somewhere 7 oceans away, a local signs up for LocaLink
3. The local signs up to help users with their culture
4. The user writes articles about their culture
5. You read the articles and learn about the culture
6. If you like the articles, you can contact the local and they will tell you more about the culture when you visit their country

How can I help?

You can help by writing articles about your culture. Sign Up: https://localink.vercel.app/dashboard

Inspiration

We were inspired by the fact that we're all different and we all have different cultures. We wanted to create a platform where people can learn about other cultures and connect with locals from all over the world.

How we built it

We wanted to build a platform that was easy to use and easy to navigate. We also wanted to keep the UX in mind when building the platform. We used React for the frontend, and we custom built the backend using NextJs 13.2 API Routers (yes this was released yesterday). We used cockroachDB for the database and we used Vercel for deployment.

TailwindCSS was used for the styling. Radix UI was used for the components. We used NextAuth for authentication. We used Prisma for the ORM. Eslint and Prettier were used for linting and formatting. Typescript was used for type safety.

Challenges we ran into

• We had to learn how to use NextJs 13.2 API Routes
• We faced issues because our previous database (MongoDB) did not work with next-auth's prisma adapter
• We faced several issues with NextJs 13.2 API Routes because these are literally experimental and not officially released yet
• NextJs 13 dynamic routing works differently than NextJs 12 dynamic routing

Accomplishments that we're proud of

• We're proud that we were able to build a platform that is easy to use and easy to navigate
• We're proud that we were able to connect the frontend and the backend
• We're proud that we were able to learn how to use NextJs 13.2 API Routes
• We're proud that we were able to learn how to use NextJs 13.2 dynamic routing
• We're proud that we were able to learn how to use NextAuth with Prisma
• We're proud on how efficient we were able to work with the help of Git and Github

What we learned

• We learned how to use NextJs 13.2 API Routes
• We learned how to use NextJs 13.2 dynamic routing
• We learned how to use NextAuth with Prisma

What's next for LocaLink

• We want to add a chat feature
• We want to add a like feature
• We want to add a comment feature
• We want to add a report feature
• We want to add a search feature
• We want to add a settings page
• We want to add a notifications page

Built With

• NextJS

NextJs is a React framework for building production-ready websites and applications. It's a framework that allows you to build static and server-rendered websites and web applications using React.

We used it as our fullstack framework. We opted in to use the experimental app.

• TailwindCSS

TailwindCSS is a utility-first CSS framework for rapidly building custom user interfaces. It's a CSS framework that allows you to build custom user interfaces.

We used it for styling our components.

• RadixUI

RadixUI is a collection of accessible, fully-customizable UI primitives for React. It's a collection of React components that are fully customizable.

We used it for the navbar component.

• NextAuth

NextAuth is an open source authentication provider for Next.js. It's an authentication provider for NextJs.

We used it for authentication.

• Prisma

Prisma is an open source ORM for Node.js and TypeScript. It's an ORM for Node.js and Typescript.

We used it for the ORM, it was a great experience using it.

• CockroachDB

CockroachDB is a distributed SQL database built on a transactional and strongly-consistent key-value store. It's a distributed SQL database.

We used it for the database, it was a great experience using it.

• Vercel

Vercel is a cloud platform for static sites and Serverless Functions. It's a cloud platform for static sites and serverless functions.

• GitHub

GitHub is an extremely excellent tool for hackers, we used github as the single source of truth for our code (VCS Hosting), we used GitHub Issues as our issue tracker, GitHub Pull Requests as Code Review Tool, GitHub Projects as Project Planner and GitHub Actions for automating GitHub Releases (yes, automated github with github :P), GitHub Apps for continuous deployment (Vercel), Testing Security (Snyk), Restyling PRs on Demand (Restyler).

We also used GitHub Copilot as our copilot during this hackathon, copilot helped us a lot in all of our coding, it helped us remove duplication of work and be productive.

VSCode (part of GitHub Global Campus) was the code editor that was capable to let this project be true.

Figma (part of GitHub Global Campus) was used for design

GitHub Codespaces allowed us fast coding on amazing servers 0.0 (Must have as a dev)

Gitlens, Pomodone, ImgBot, Sentry, Doppler and Restyled are some other things that we used thanks to GitHub Global Campus

• Godaddy Domains

Godaddy gives cool domain ideas, and can I just say it? Ok I'll say it, porkbun is the best DNS solution to have ever been provided by a domain name registrar

Acknowledgements

• NextJs 13
• Radix UI
• NextAuth
• Prisma
• CockroachDB
• Vercel
• TailwindCSS
• Eslint
• Prettier
• Typescript