Modern monoliths: SPA and API in a single codebase

Inertia.js is a library that promises single page applications without needing a separate API. But how accurate is that statement?
In this video, I go over the current landscape of fullstack apps, and what a modern example built with Laravel and Next.js looks like. Then, we take a peek at the same example using Inertia.js, dive into how it works, and get a feel for what the development experience is like.
I've used Inertia.js on multiple projects at this point, and it's made creating single-page applications so much faster and smoother. Don't take my word for it though, try it out yourself!
Interested in learning how to build real-world practical apps with Laravel and PHP? Preorder my latest course at selfmadesaas.com for 25% off until launch!
inertiajs.com
laracasts.com/series/build-mo...
harrk.dev/getting-started-wit...
- 0:00 Intro
- 1:01 An Existing Full-Stack App
- 3:14 Introducing Inertia.js
- 3:56 The Same App Using Inertia.js
- 6:15 How's It Work?
- 8:55 Adding A New Page
- 10:46 Conclusion
Send me new video ideas and vote on what's coming next: suggest.gg/aschmelyun
Follow me on Twitter! / aschmelyun
Join my newsletter, where I send out new information about twice a month in the PHP, JavaScript, and Docker realms: aschmelyun.substack.com

[@dominuskelvin]

Inertia makes The Boring JavaScript Stack possible and it really is a modern way to build SPAs.

[@serialKillerReborn]

Kelvin, Boycott VueJS hehe

[@juanmacias5922]

Dang, that's sleek! I'll have to look into Inertia.

[@aschmelyun]

You definitely should! I haven't been disappointed with the stack yet. It honestly takes the tedious parts out of frontend dev and leaves the best.

[@juanmacias5922]

@@aschmelyun Any suggestions on cheap hosting for portfolio projects using Inertia?

[@danimatuko]

Very nice introduction, and it's really interesting.
Btw, can you share your theme and font? They're nice.

[@kwasiezor1630]

Yeah. I like the idea that is great befenit to have a monolith app than using 2 different stacks. I'm great fan of real and laravel. So I will be a real pleasure, if you can help us learn more about inertiajs. 😊 Thanks

[@hellodefhellow]

Damn your channel is good, start making more videos

[@HydeJekyl-gb1cb]

Hi. Please tell me what vscode theme you use in this video? Many thank

[@user-yq5tw7iv2x]

Hi
Do you think Inertia be suitable for a blog magazine website long-term compared to Laravel API and React frontend seperately? What kind of problems can we bump into using Inertia if the project becomes big?

[@blessdarah1256]

Remember that this is you building a SPA without having to build a separate API. So if in the long run you will need to develop something like a mobile app, then inertia is not sutied for you because your mobile tenant needs access to your API.

[@skia515]

@@blessdarah1256exactly. this technology is made to make SPA without API, but for a big and long term website that maybe need a mobile application too, it’s not a good choice, cause actually you need to extracting datas one time and using in different devices like phone. but if you need just a website, it’s good

[@aschmelyun]

I'll agree with the comments responding to this that if you grow and need a separate API it's kind of redundant. But at the same time, you can have your API and SPA routes in the same codebase.
Instead of having duplicate blocks that fetch the same data, you can abstract that out to a data object layer so you have a single point to update.
For me personally, I've built a few large projects on Inertia (including a blog/online magazine) and haven't ran into any issues with performance or scalability. SSR out of the box with Inertia also greatly improved SEO.

[@blessdarah1256]

@@aschmelyun yes having a separate service layer to handle that also works pretty well.

[@SXsoft99]

@@blessdarah1256 if you don't put your logic in controllers, you just need to double the response in a API controller

[@Dommmin]

Hi, can you share source code? I want to compare next.js and inertia.

[@blender_wiki]

Maintenance of microservices is notably easier and more efficient compared to a monolithic structure. The microservices architecture facilitates streamlined processes for staging, testing, and deployment. Redundancy in code architecture often indicates weaknesses in its design.
However, it's essential to note that "inertia" is a valuable and versatile library, offering substantial benefits to various projects, though perhaps not exactly for the reasons presented here.

[@amined801]

is Inertia works well with SEO?

[@drugoviic]

inertia has support for SSR so yes

[@bartellconstantin6747]

I really need Inertiajs tutorials using reactjs because i do not want to leave Vuejs

[@blessdarah1256]

I’m currently working with React and Inertia

[@yashasvprajapati6851]

you can use nextjs 14/13 to build your backend and frontend inside one project itself.

[@bohdan.vorona]

It's toooo complicated 😢 You could just use Laravel with Blade…

[@Icodestuff]

inertia is very simple... Plus makes your application much more interactive than plain blade

[@DevPenguinBD]

😅😅🙃🙃

[@drugoviic]

id recommend livewire, you can just wire:navigate between your blade components

[@tanzimibthesam5861]

@@drugoviic did you face performance issues with Livewire?

[@aschmelyun]

Livewire is great, but if you enjoy (or have to) work with React/Vue, Inertia just makes it a better experience imo

[@sk4yb3n]

The only drawback is that your routes are exposed publicly, keep that in mind

[@JagdeepSinghKalsi]

As in - the 99% of the web ?

[@dominuskelvin]

Not really. You can set up policies or guards for authenticated requests

[@JagdeepSinghKalsi]

@@dominuskelvin I guess I see your point - thanks!
Will see if there is a way to prevent this.