My Bleeding Edge Tech Stack for 2025

if you're building a web or mobile app in 2022 there's literally a million different ways to get the job done by combining different front-end and back-end libraries along with apis tooling and infrastructure to form a complete tech stack in today's video i want to give you a guided tour of my tech stack which i plan on using through 2025 assuming the world hasn't been destroyed by that point not only will i explain my thought process when making these decisions but we'll also look at a ton of alternatives that you may want to consider for yourself because you definitely shouldn't just copy some random guy on youtube before we get into it as many of you know i recently had a baby i haven't been uploading quite as many videos but it's given me time to work on a complete rebuild of fireship io and in the process i've analyzed all kinds of different technologies that i might want to use for that project now i don't really need to rebuild fireship but i do it every couple years just because i enjoy the process most of the coding i'll do with my bare hands but the project will be open source and i will likely collaborate with a couple of other engineers to round out the project it's a small team effort which is an important consideration when choosing your tech stack because many technologies are more well-suited for large teams software engineers love to flex that tech stack gotta be bustin or drippin in other words ridiculously over-engineered the reality is that i could build fireship as a wordpress blog add a membership plugin and scale it up to millions of users if i want to make money that would be the smart thing to do but i want to build something a little more special than just a wordpress blog in the next version of the site courses will have progress tracking that will also include challenges like quizzes and interactive demos powered by stack blitz in my experience the majority of modern web development happens on the front end that being said one of the most important decisions to make is your front-end ui library and for that i have chosen svelt i've built something with pretty much every ui library on the market they all have their pros and cons but svelte is the one that feels most productive to me and coincidentally just yesterday it debuted at the top of the most loved web frameworks on the stack overflow 2022 survey i think developers love it for how natural it makes reactive data feel when a mutable variable changes the ui reacts you don't have to jump through any weird hoops to make things reactive now the other thing i really like about spelt is the way you share data across components which is done with stores a store is like a subject in rxjs that can be observed anywhere in the application by simply putting a dollar sign in front of it this pattern is actually very similar to the way things are done in angular but svelte does it with a lot less boilerplate the current version of fireship is actually built with angular and in my opinion angular is awesome and the most underappreciated framework out there it's extremely popular in enterprise for a good reason but in 2022 react is definitely still the most popular ui library and it has a huge ecosystem of supporting libraries i think that's the most compelling argument to use it when it comes down to the ui library itself there are cleaner options out there like solid js that would also provide better performance i also seriously considered vue which is not only a great framework but also has a large number of supporting libraries as well but the more important decision is which meta framework do you want to use react has next view as next angular has universal and svelt has kit most applications out there need some form of server-side rendering to make their sites visible to search engines and bots spelt kit is the official ssr solution that's being worked on by rich harris but as of today it's still in beta using a framework that's not at a stable release is kind of risky you could pour a ton of work into an app then the framework developers decide to pull a feature on the final release that torpedoes your entire business not very likely so that's a risk i'm willing to take now there are other ways to server render spelt another good option is astro it has a lot of awesome features for content driven sites but the reason i prefer spelt kit for this project is because it does client-side routing after the initial page load which becomes important on more interactive sites especially when user authentication is involved but my plan is to use astro for my personal portfolio if i ever get around to rebuilding it now the other framework that i would say is my second choice is next js next is already a great framework but it has a bunch of cool stuff coming as well like nested routing and stuff like that i also recently made a video on next yet another awesome framework that i hope to make a full course on in the future it's also worth mentioning that there's a new framework called quick that has an entirely different take on rendering with resumable or replayable applications but even that's a little too bleeding edge for me now when it comes to server rendering you don't need to use a meta framework that's tied to some javascript library instead you can use a full stack framework like ruby on rails laravel django or whatever to render all of your content on the server these frameworks have advantages for certain types of applications but in my case full-blown server-side rendering is not really necessary because the content on the actual site doesn't change all that often it's far more simple to pre-render the entire site upload it to a storage bucket and then cache it on a cdn around the world when you have a dedicated server you then need to think about how to scale it with either serverless functions or if you want a really complicated tech stack something like kubernetes the next thing i want to talk about is typescript if you're building a big complicated project you should use it in the end a more complicated question you'll have to ask is how am i going to manage my css when i work on a solo project i spend more time around with the css than i do writing javascript it's depressing man i've only got so much time left to hold fortran 3. life goes by much faster than we think yet here i am wasting hours of this precious time trying to figure out why this navbar won't be sticky that being said a tool that makes css much easier is tailwind most importantly it makes prototyping and the implementation of your designs go much faster i like to have a lot of control over my designs because for me it's a creative process tailwind won't magically make your website look good but it does provide enough of a framework to get things done way quicker the current version of fireship is 100 custom with sas with tailwind i feel like i have the same amount of control but things just get done much more rapidly and another huge benefit is that it will automatically purge styles to keep the css bundle as small as possible that's important because the initial page load speed for my site is critical if you like the utility class approach another option to check out is windy css or if you don't care about having that much control you can use something like bootstrap in addition to many other css frameworks out there and you've also got tons of framework-specific ui libraries to analyze as well and if you're using tailwind you should definitely check out daisy ui but i'm just doing everything from scratch myself because i'm an idiot that's enough for the front end now i want to talk about the back end as you know i'm a big fan of firebase and it's been the foundation of this channel from day one but as i've grown older and wiser i've come to realize something about firebase this may be shocking to some of you but firebase is still awesome and i plan on using it until the day i die or at least until google decides to kill it whichever comes first firebase will do 90 of what most apps need on the back end the main drawback is that you're tightly locked into google cloud platform and you may run into edge cases that it just doesn't support like advanced authentication features or complex database queries and that can be a deal breaker for certain types of apps what you could do is architect your entire backend from scratch by picking and choosing different services in the cloud but then the complexity of your code base is going to explode luckily in 2022 there are quite a few alternatives to firebase you've got big ones like aws amplify and mongodb realm and then smaller startups like enho superbase and app right i recently compared all of them and each one has its own set of unique trade-offs expect a full video on that soon the most important thing is the database firebase uses firestore which is a document database similar to mongodb which can get the job done for most apps but does have some limitations that can be kind of annoying at times a traditional sql database is probably the safest bet for most people but they're generally harder to work with although there are some services out there like planet scale and cockroachdb that have made things a lot easier in recent years especially when used with an orm like prisma in addition you might consider other nosql databases like redis and cassandra which can actually be used as a primary app database now in addition to the back end there are a lot of other smaller tools in the stack when it comes to testing i find that i need to keep things very simple otherwise i'm not going to test anything at all and my preferred way to do that is with cyprus which is basically an all-in-one package that can do everything from end-to-end tests to individual unit tests and everything in between if you're not into cyprus another good option for end-to-end testing as playwright and if you just want to do unit tests another framework i've really been wanting to try out is v-test which is based on vee the build tool that powers spelt kit my tech stack also uses a variety of apis to do things that i can't do on my own one of which is send transactional email i currently use sendgrid and will continue doing so in the future but i wish firebase or google cloud would come out with its own email service in addition a content driven site needs to have really good full text search to handle that i'm using algolia algolia can get pretty expensive on very large sites but for me it's pretty inexpensive and very easy to use this is yet another feature i wish would be implemented into firebase but i'm not going to hold my breath and finally i'll be using stripe and paypal to manage payments because to be honest i haven't looked at any alternatives in a long time the end result is a pretty simple tech stack with the main components being spelt kit and firebase the only major problem is that it doesn't form an obvious acronym we could go with the fist stack or maybe fire kit or perhaps it but i don't know man let me know if you have a better idea thanks for watching and i will see you in the next one

Channel: Fireship

Views: 665,529

Keywords: webdev, app development, lesson, tutorial

Id: rFP7rUYtOOg

Length: 8min 43sec (523 seconds)

Published: Thu Jun 23 2022