Next.js, Mapbox, Prisma: Crosswalk user voting platform - Project Overview (Crossywalk)

Suggest your own crosswalk: crossywalk.com/
Repo: github.com/hudyu17/zebra
Not so much a tutorial than a recap of how I built crossywalk - was a fun personal project that helped me get more familiar with maps :) Let me know if you want a more in-depth explanation of anything that shows up here
Some other videos that I found very helpful:
- Leigh Halliday's Next.js course: • Next Level Next.js
- Dan Morrison's Bus Map project: • Bus Map with Next.JS a...
Other relevant links:
- TailwindUI: tailwindui.com/
- Prisma and Next.js: www.prisma.io/nextjs
- Mapbox GLJS: www.mapbox.com/mapbox-gljs
- React-map-gl: visgl.github.io/react-map-gl/
- Google Places API: developers.google.com/maps/do...
00:00 Intro
01:17 Platform runthrough
03:17 Tech Stack - Overview
04:12 Frontend (Next.js, Tailwind)
07:42 Backend (Postgres, Prisma)
09:47 Backend (Next Auth)
10:57 Map (Mapbox)
13:53 Location Search (Google Places API)
15:14 Conclusion

[@real23lions]

Good video. Good info for me since i'm new to Prisma and Nextjs. I'm using with Planetscale which has a generous free tier

[@hudsonyuen]

glad you liked it

[@taylorparrish4323]

cool project

[@samuelberton3778]

Maybe put this video or something on the homepage as like a landing page.

[@hudsonyuen]

good idea - might do that

[@ouss]

op

[@DigitalAlchemyst]

Are you interested in working together to develop this further into a more full fledged community project backed by block chain and to expand to include voting on all civic matters

[@arianahmadi4005]

hey hudson sick project i was wondering would you care to make a video of like how you code this and if you would re do it what areas you would spend more or less time. I am new to react and coding world but your project is amazing. keep it up :)

[@hudsonyuen]

appreciate it! I'm currently working on a walkthrough for another nextjs project that also uses tailwind and prisma - I might return to another video on crossywalk after that

[@arianahmadi4005]

@@hudsonyuen great keep it up :)

[@frenchman451]

Is there a way to get this running locally? I want to download the repo and see it running on my laptop. Thanks

[@hudsonyuen]

yep, just run `npm run dev` and it'll spin up. You'll also need to create your own .env file with:
- NEXT_PUBLIC_MAPBOX_GL_ACCESS_TOKEN (for the map)
- NEXT_PUBLIC_GOOGLE_MAPS_API_KEY (for the google maps search completion)
- DATABASE_URL (I used heroku)
- GOOGLE_ID, GOOGLE_SECRET (for auth)
- NEXTAUTH_URL (which should just be localhost:3000 if everything else is default)