You are browsing as a guest. Sign up (or log in) to start making projects!

Car For Speed

  • 1 Devlogs
  • 2 Total hours

A super fast car garage website with a playable retro 3D racing game like OutRun! I coded the whole game myself with just normal HTML, CSS, and JavaScript without using any big libraries or cheats. It has a cool hacker computer screen at the start, turbo boost meters, and a curvy road where you dodge traffic cars!

Ship #1 Pending review

It is a retro 100-octane garage portfolio and a playable 16-bit arcade racing game like OutRun. I built the entire thing with just vanilla HTML, CSS, and JavaScript without using any big libraries or npm packages!

What works & what did you build?

An ECU computer boot screen that pretends to test twin turbochargers and 100-octane fuel maps before revealing the site.

A real playable pseudo-3D perspective road engine on HTML5 Canvas where you use W/A/S/D or arrow keys to steer, drift along curves, and beat the 45-second timer.

Fixed a crazy bug where overtaking yellow traffic cars became giant boxes covering the entire screen!

Telemetry gauges, boost monitors, and showcase cards for my hardware and coding projects.

Uploaded everything cleanly to GitHub and hosted it live on GitHub Pages.

Try project → See source code →
Open comments for this post

1h 52m 58s logged

I made a super cool website called Cars for Speed! It has a giant car garage and a retro 80s racing game like OutRun, and I made the WHOLE THING myself with just normal HTML, CSS, and JavaScript. No giant boring libraries or cheats!Stuff I made and fixed:Cool Computer Boot Screen: When you open the page, a black hacker screen pops up that says it’s checking the turbo boost and putting 100 octane race gas in the engine before the game starts.Fake 3D Road That Doesn’t Make Your Tummy Hurt: At first, the road lines were moving weird and made me feel dizzy. So I did tricky math with perspective so the road looks like real 3D curving left and right into the sunset!Fixed The Giant Monster Car Bug: Earlier, when I tried to pass a yellow car, it got HUGE like a giant yellow box that covered the whole screen haha! I fixed the size numbers so it stays regular car-sized and zooms past my bumper.My Real Garage: I added boxes showing my other favorite stuff, like my 21-speed mountain bike with lockout and my computer boards with real wires.Put it on the Internet: I put all the code nicely into separate files, uploaded it to GitHub, wrote the instructions, and turned on the website so anyone can click and drive!

0
0
15

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…