Building a new full-stack app from the ground up.
Building things is hard, and as a self-taught developer, it can be difficult to not know what you don't know.
So I am going to be writing the process out across a series of blog posts.
The goal
I built an app called Action Backers which, from our own marketing is characterized as
...an innovative sports betting analytics platform that can help you increase your winnings and make more informed decisions. Our cutting-edge data and analytics tools provide valuable insights that can give you an edge in the competitive world of sports betting.
It started off as a humble WordPress blog, back in 2018 as a way for me to take my knowledge of the sports betting industry (once upon a time, I worked for an online sports book), and give my thoughts on which books were good, bad and ugly.
It blossomed in to something much bigger and has had several iterations over the years, into what is now a full-blown platform where members can come and learn how to sports bet, track their bets, interact with our machine learning models, and more.
Built with Next.js, Prisma, Planet Scale, Tailwind, and TypeScript, it is a full-featured app with just about everything I had hoped for in an MVP.
The challenge
So that all sounds great, but the issue I am facing, is that I built it myself end-to-end and did it as quickly as I could. It took about 6 months to build, not including the year of back and forth as to whether or not to build it in the first place. This means it is not terrible scalable. And the organization is... sub-par in places.
I didn't know what I didn't know. And I still don't. This will be an ongoing theme, and I think it's important to realize, that as self-taught developers, that is okay! All we can do is learn from our mistakes.
In my case, the solution I can see is to re-write it again. This time properly -> not so tightly coupled and with the architecture taking presidence.
I have a lot of features that I wanted to include in this current version of Action Backers, but I didn't know how at the time, and now, I am afraid to add anything for fear of the spaghetti coming unglued.
A high-level overview
While this is a production app, it is still small enough, and this will take me long enough that I think I am going to take a few chances at implementing some different tech. Look, I love Next (this site is built using Next 13), but everything I build seems to use it. There is some cool stuff out there that I have been itching to try.
This is bound to change (up until this morning I was still going to use Express), but I think I am going to build the back-end in Node (unless I move to Deno??), but I am going to use:
-
Fastify instead of Express. I thought about Koa as well, especially since I work at Strapi, which runs on Koa... but it isn't my favourite. Not that Express is some darling either though.
-
For the front-end, I will be using Solid (in conjunction with Start). I am really excited about this one; it looks amazing to work with, and I have really enjoyed using Vite in some newer projects.
-
I also want to use Astro in some capacity, maybe for the marketing site.
-
I haven't found a better tool for DB stuff than Planet Scale. I likely will stick with this, unless I really think it neccessary to run directly on AWS or similar.
-
Acton Backers has some fairly intensive business logic (a lot of which, I am currently running on the front-end like a dummy, because I couldn't get it to work with my current backend config. Whoops!)
-
I will be ditching Prisma in favour of a very new project called Drizzle ORM which looks extremely cool! I like Prisma, but it is slooooowwwww.
Edit: Prisma has recently made some changes that massively speed up cold starts. This has made me re-think moving away from them.
I also don't mind writing raw SQL either, and I actually like Knex... but unfortunately, Knex doesn't really play well with TypeScript.
- Which brings me to TypeScript. This should be a given now. I am still not the best at it... but I am passable. I try to use it in every project.
- Tailwind. I love Tailwind. It goes in every project. The funny part is when I first tried it, I hated it. I hated it and vowed never again. CSS Modules forever. That quickly changed.
I will make this a series, and I'm sure I missed stuff.
Follow me on twitter @kellenbolger
Follow Action Backers on twitter @ActionBackers
This is the calm before the storm... I am excited. Maybe I've forgotten what lies ahead...
