Create Robust Web Apps with Gleam and Lustre

  Рет қаралды 29,773

Isaac Harris-Holt

Isaac Harris-Holt

Күн бұрын

Software is becoming more type-safe, but web technologies are falling behind. TypeScript alleviates some of the JavaScript woes, but it's still not enough. So what do we do?
In this video, I'll show you how to build a completely type-safe web app in Gleam using the Lustre framework.
Thanks to CodeCrafters for sponsoring this video! Level up your coding skills:
ihh.dev/codecrafters
Check out the code:
github.com/isaacharrisholt/yo...
Previous video: • Your backend is too co...
Resources:
Lustre: hexdocs.pm/lustre/index.html
Lustre HTTP: hexdocs.pm/lustre_http/index....
__________________________________________
Check out my other socials!
🎮 Discord ▶ discordapp.com/invite/bWrctJ7
🐦 Twitter ▶ / isaacharrisholt
🖥️ Portfolio ▶ ihh.dev
📝 Blog ▶ isaacharrisholt.com
__________________________________________
Timestamps:
00:00 - Introduction and explanation
00:43 - The Elm Architecture
01:48 - Our first Lustre app
04:25 - Adding interactivity
07:54 - The real world
#gleam #softwareengineer

Пікірлер: 194
@ANDROTOP
@ANDROTOP Ай бұрын
I paused the video for a sec, so you can take a breath.. you're welcome! great video ,thank you!
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Haha thank you! Believe it or not I actuallyspeaklikethisallthetime
@devyb-cc
@devyb-cc Ай бұрын
can't wait for the next gleam adventures you are covering, I'm subbing!
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thank you! Lots of exciting stuff coming
@bholmesdev
@bholmesdev Ай бұрын
Learned a few things about state management and effects, thanks! If you’re open to feedback, I had a couple thoughts: - The intro before coding was a bit too abstract for me. Would’ve liked slower-paced visuals or to jump straight into code - Take a breather between segments! You have a great problem-> solution structure, but I needed beats in between
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Appreciate the feedback, thanks! Yeah, I agree the explanation of TEA could've perhaps been a little more concrete. As for the rest, that's just kinda my style 😅 it's polarising at times, but I do get lots of people say they enjoy not having to watch at 2x speed. Thanks again, and keep up the good work on Astro 😉
@soumilbhattacharya9784
@soumilbhattacharya9784 Ай бұрын
0:09 this is my new favourite description of javascript
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Yesss it's been my go to for a while
@zakariabenhadi4637
@zakariabenhadi4637 Ай бұрын
I love all the memes / images you include, really subtle jokes sometimes ! The "scaffold" one was unexpectedly funny. Great video, ready for the next one, thank you !
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thank you! I do try 😅
@popplestones886
@popplestones886 Ай бұрын
Great content as usual... I look forward to the next one.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thanks!
@CodingWithAuryn
@CodingWithAuryn Ай бұрын
Whoa, this looks so amazing. I am in love with elm, and seeing gleam doing the same is just amazing. Maybe I can do my next project in it 🥰😍
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Do itttt! Gleam is a bit more flexible, and Lustre is fantastic!
@isaactfa
@isaactfa Ай бұрын
20 million web developers and barely 20 good websites...
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Hahahhahaha so true!
@sosquite8866
@sosquite8866 Ай бұрын
Very nice video man !
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thank you!
@whkoh7619
@whkoh7619 Ай бұрын
Looks great!
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It is! Highly recommend checking it out
@AK-vx4dy
@AK-vx4dy Ай бұрын
Such a Beauty. Now i clearly see benefits from Gleam evolution. Transpiling to JS is mega selling point. If i didn't seen Elm before then feeling is like on first Rails presentation 20 years ago... magic and turtles all the way down ;)
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I think there's very little magic. In fact, what I like about Lustre is just how clear all the flows are, since they're all laid out in your model
@nightmare_js
@nightmare_js Ай бұрын
Unfortunately ELM is not actively maintained, its lasted version is from 5years ago so I’m glad there’s finally a good alternative to ELM. Looking really good, definitely going to try it out.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I would disagree that it's close to TypeScript at all. Gleam's type system is much more robust, and TEA is not something most TypeScript apps use.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Gleam is getting popular because it's genuinely a joy to write. It's a really good intro to FP for people who aren't familiar with it, it's really simple, it's got a great type system, the community is lovely, and the multiple compilation targets are very useful. Most of the other langs that compile to JS don't also compile to a BEAM VM language. When I do later videos in this series, you'll see how beneficial that is - you'll get full stack type safety while being able to make use of the BEAM's amazing scalability and fault tolerance.
@Heshamelfakharani
@Heshamelfakharani Ай бұрын
i really hope development for gleam and things like lustre continue and dont end up in ELM land
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I think Gleam will go further, being a general purpose language. It's also got amazing applications on the server thanks to its BEAM target
@aaa-my5xy
@aaa-my5xy Ай бұрын
your videos are really good
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thank you so much! I've got more coming 😉
@keffbarn
@keffbarn Ай бұрын
Nice. The problem, though, is that with all these languages offering an alternative development experience (F#, Elm, PureScript, etc.), the ecosystem and libraries are so far behind modern-day frontend development that there's literally no good argument for using them other than for fun side projects in your spare time. I will try gleam for my next toy frontend app though 🍻
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
In some ways yes, and in others no. I agree that the ecosystem is larger in other langs, but I don't necessarily agree that there's no good argument to use them. Elm has been used in production sites just fine, and if you don't need a mega-interactive site (which is 99% of projects, to be honest), something like Lustre is probably one of the more robust ways to get there.
@keffbarn
@keffbarn Ай бұрын
@@IsaacHarrisHolt Well, I'll give you that there are good arguments for using something like Gleam, but I would say they are not strong enough if your end goal is to ship products as fast as possible. However, if something like shadcn/ui and Flutter comes to Gleam, I'll definitely change that statement!
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@keffbarn totally fair! We're exploring the possibility of a Laravel-like backend framework for Gleam at the moment too: github.com/Pevensie/pevensie/discussions/1
@chneau
@chneau Ай бұрын
Can think of blazor from c# too
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@chneau I'm not entirely sure I see the connection here. Isn't Blazor just a templating language?
@tubbystubby
@tubbystubby Ай бұрын
As someone who is a little bit into gamedev I can relate really well with TEA .
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Awesome! Are you gonna try it?
@NiNgem-bb6lc
@NiNgem-bb6lc Ай бұрын
Beautifull!
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I know right!
@alexandremachado3975
@alexandremachado3975 Ай бұрын
It’s giving great content
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Thanks!
@camstuart
@camstuart 27 күн бұрын
Thanks for this video! Gleam and Lustre are very interesting. I’ve been learning phoenix, and one thing that I can’t find is information on interop approaches between Gleam and other beam languages. I think that’s an overlooked killer feature for gleam that nobody seems to be talking about. Image the power of tools like ecto and phoenix written in gleam!
@IsaacHarrisHolt
@IsaacHarrisHolt 27 күн бұрын
I've actually got a video on this coming out... _checks watch_ tomorrow!
@camstuart
@camstuart 27 күн бұрын
@@IsaacHarrisHolt can’t wait!!
@gurvirbaraich
@gurvirbaraich Ай бұрын
Already made one 2 weeks ago. Was nice
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Awesome! Are you planning to do it again?
@Jojor11
@Jojor11 Ай бұрын
I’m curious and need to play with this. I’ve been loving learning gleam and looking something to use it in. Any approach to use it on web makes easier to find a place I guess, even if just for simplicity, but I’m still wary of how good js transpile… I need to try it myself and check on the ergonomics of this kind o pf solutions
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Please do! Let me know what you think :) in my experience, the JS output is probably slightly less performant than vanilla JS, but the type guarantees you get outweigh that tenfold.
@user-jx8uz6tb6k
@user-jx8uz6tb6k Ай бұрын
Does it transpile into JS? Then what stops runtime code in JS (which have weak typing) to create runtime errors? What about external data, eg from API? At least, WebAssembly is typesafe
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
External data can be a source of errors regardless of the language. Thankfully, Gleam decoders prevent it from crashing your code and provide a nice way to handle it. And yes, it does transpile to JS, but the type guarantees you get from Gleam's type system work really nicely, and Gleam code won't throw exceptions (unless you FFI to JS code that throws)
@taquanminhlong
@taquanminhlong Ай бұрын
Looking good, I wonder what it would look like when the application is at the production scale 😂 tons of effects and states inside the modal?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
You'd generally split your model and message types, and then have an update and view function per page that gets called from the main ones depending on the view!
@lpil
@lpil Ай бұрын
Lustre is so dang cool
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I know, right. It's the only reason Gleam is any good, tbh
@OfficialLify
@OfficialLify Ай бұрын
You creator of gleam?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Louis? Yeah he is
@lpil
@lpil Ай бұрын
@@OfficialLify yup
@AntonioZL
@AntonioZL Ай бұрын
I'm an alternative timeline, Lua became the backbone of the web, and in that timeline, I'd be happy... 😔
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
What's stopping you from making it happen 👀
@Danielo515
@Danielo515 Ай бұрын
I love how this is like Elm, but open source and backed capable. My problem with this level of abstraction over HTML is how hard animations become. After experiencing how easy animations are with svelte, and how important they are for user experience I am very worried about trying anything else
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Fair point. It's something that's come to my mind too, honestly. You CAN break things out into components, so I imagine for things that need animations you'd do that, but you could also just write the animations in CSS (which is mostly what Svelte does anyway)
@Danielo515
@Danielo515 Ай бұрын
@@IsaacHarrisHolt css animations are great when they fill the bill, however when they are not you want to have dom manipulation control. Svelte provides fly, slide and other animations that are not doable with plain css
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
That's true. You could probably achieve what you want with effects that show/hide elements and do a transition in the background, sending a message once done
@danilodjokic5303
@danilodjokic5303 Ай бұрын
This is pretty cool. I have a question though. How does the browser interpret the interaction? Does it get compiled to javascript ? Is it possible to just return HTML from lustre endpoints and use something like HTMX ?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It does compile to JS, yes. You CAN use HTMX with Lustre SSR, but it's kinda pointless. Lustre is full stack, so you can use it on the backend too. I just haven't got that far in the series!
@danilodjokic5303
@danilodjokic5303 Ай бұрын
@@IsaacHarrisHolt Interesting. You can build both your FE and BE in gleam and leverage BEAM on the backend and type-safety on the frontend, right? If so, what would be the pros and cons of this approach ?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
The biggest pro is that you get full stack type safety, and you get to leverage the BEAM to create a really scalable backend. Cons wise, you're locking yourself into Gleam. I don't see that as a massive problem though, to be honest
@cig_in_mouth3786
@cig_in_mouth3786 Ай бұрын
I am totally new to the elixir erlang thing, phoenix really something like not using json my mind broke. Can I do the same thing with gleam or am I misunderstood. Thanks
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Yes! Lustre supports sending updates over websockets. That's a future video :)
@cig_in_mouth3786
@cig_in_mouth3786 Ай бұрын
@@IsaacHarrisHolt how can I learn these? Like I learnt the struct and basics of elixir and now thinking about phoenix but I never wrote Ruby on rails so pattern is something else. I was thinking of switching to gleam and your videos really motivate me
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@cig_in_mouth3786 I would take a look at the Lustre docs, which are linked in the description
@cig_in_mouth3786
@cig_in_mouth3786 Ай бұрын
Wow the last part is amazing so I can generate a static site, so cloudflare can cache those and even my server is down, my blog will be up
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@cig_in_mouth3786 it's good stuff!
@tsooooooo
@tsooooooo 19 күн бұрын
does lustre work like Phoenix liveview under the hood, i.e. does state live on the backend?
@IsaacHarrisHolt
@IsaacHarrisHolt 19 күн бұрын
Not in this example - here we're just serving HTML, CSS and JS (compiled from Gleam) to the frontend. Lustre supports server components which work on the way you're describing
@blidi666
@blidi666 Ай бұрын
I'm an Elm orphan, I love ELM but I'm really disappointed by the fact it's more or less abandoned. I'm glad Gleam and Lustre are here to make SPA development joyful again. The difference with Elm is, as I understand, Gleam is not a pure functional language, any function can be non deterministic and have a side effect, so it's up to the developer's discipline to write pure function and managed effects while using Lustre. I think encouraging purity without imposing it is a good trade off though, especially for a language that targets mainly the BEAM and is meant for backend dev.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Gleam is wonderful, honestly. And you're right, Gleam functions can have side effects. As you said though, it's discouraged outside of a managed effect when using Lustre. Especially IO, as that'll have a performance impact and will probably block your UI updates.
@theshy6717
@theshy6717 Ай бұрын
Why would I use that?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It's a different way of thinking and it actually makes a lot of sense. Give it a go and you'll understand :)
@Fik0n
@Fik0n Ай бұрын
Would be interesting to see some good and more complex interactivity implemented in Lustre. I know it wasnt your intent to show case that but with frameworks like this I often think that it seems slightly painful to build a great user experience.
@Fik0n
@Fik0n Ай бұрын
Also, why focus on a js target with gleam? To me the erlang machine seems much more interesting. The JS frontend ecosystem is so developed at thus point
@nightmare_js
@nightmare_js Ай бұрын
Yeah that’s a great point, I wonder how would it look like to build a reusable search-box component with autocomplete, multi-selection and accessibility. How many messages and update functions would be needed, it also seems like all component’s state is managed at the application level which can be overwhelming. On the other hand this seems very interesting specially for simple UIs that may not need a whole JS Framework. I definitely would love to see more of Lustre and Gleam.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
For stuff like this, Lustre DOES support a component model, so you can delegate to that when you need to. You just wouldn't store your entire application's state in such a model
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
As for why the JS target, it's just a different application of Gleam. Lustre is actually a full stack framework - I'll be doing into doing more with Lustre on the BEAM in future videos!
@Fik0n
@Fik0n Ай бұрын
@IsaacHarrisHolt that's cool, but I'm remain unconvinced that backend is the right place to create this interactive experiences. Feels like they will always play catchup, personally I think some more headless setup is better for that. Not a knock on your video though, more a general thought
@Ca1vema
@Ca1vema Ай бұрын
Woaw, another tool to create basic CRUD stuff, that's what we needed
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It's not just CRUD stuff - that's just what I've shown off here. You can do a whole lot with Lustre! Would you say React is something for "basic CRUD stuff"?
@paulojose7568
@paulojose7568 Ай бұрын
Useless complaint
@BrunoBernard-kn6vt
@BrunoBernard-kn6vt Ай бұрын
🎉 amazing! Introduce a little bit of interactivity such as AlpineJS. It would be amazing.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
But I can already add interactivity with Lustre. I'm not sure I see the need for Alpine
@deadchannel8431
@deadchannel8431 Ай бұрын
I feel like the view will look messed up when the html has to be nested a lot
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Why? You can break it out into view functions :)
@pancetoman8882
@pancetoman8882 Ай бұрын
I get the following error when trying to run the app as you do (7:40) error: Unknown module error: Unknown module ┌─ D:\gleam programs\app\src\app.gleam:31:26 │ 31 │ fn view(model: Model) -> element.Element(Msg) { │ ^^^^^^^^^^^^^^^^^^^^ Did you mean `lustre/element`? No module has been found with the name `element`.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I haven't shown all the imports in my code. You'll need to import `lustre/element` like the error message says
@knolljo
@knolljo Ай бұрын
so gleam is fullstack?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Absolutely! You can use Gleam for your backend and your frontend, and Lustre can cross both!
@knolljo
@knolljo Ай бұрын
@@IsaacHarrisHolt amazing!
@gamingwolf3385
@gamingwolf3385 Ай бұрын
Its fast and cool , but what the problem with the syntaxe , uts totally different ? 😅
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Gleam is a functional programming language, so the syntax will be different to non functional languages somewhat. That said, Gleam still aims to be readable for non functional programmers
@kollpotato
@kollpotato Күн бұрын
looks very promising, but is it performant comparing to vanilla js?
@IsaacHarrisHolt
@IsaacHarrisHolt Күн бұрын
It's unlikely to be exactly as performant, but browsers are so fast these days that you're not going to notice the difference. It also depends on your code. It's really easy to write really slow JS
@adlex1212
@adlex1212 Ай бұрын
So I can't just write xml, I have to nest functions? that is pretty off putting.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It feels a little strange, but you get used to it pretty quickly. Louis (Gleam creator) has also made a tool that translates XML to Lustre
@hoteny
@hoteny Ай бұрын
Bro how come number/0 is 0 in gleam :((( why
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
There are good reasons for it, and they're well documented!
@hoteny
@hoteny Ай бұрын
@@IsaacHarrisHolt i bet its some optimization thing but yeah gotta be careful (i dont know enough about web dev)
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@hoteny there's a GitHub issue explaining everything here: github.com/gleam-lang/gleam/issues/895
@thisismissem
@thisismissem 9 күн бұрын
Ha, the description initially about state is literally identical to how Dan Abramov talked about redux in like 2015/14.
@IsaacHarrisHolt
@IsaacHarrisHolt 8 күн бұрын
Interesting! That's well before my time I'm afraid
@thisismissem
@thisismissem 8 күн бұрын
(Unfortunately I couldn't give you the direct URL to another KZfaq video in response because KZfaq thought it was spam 🤦🏻‍♀️
@IsaacHarrisHolt
@IsaacHarrisHolt 8 күн бұрын
Ah that's annoying. I'll find it :)
@thisismissem
@thisismissem 7 күн бұрын
@@IsaacHarrisHolt there's also a really interesting talk from Mark Erikson at React Summit 2024 that gives the history of redux & shows the diagram I was talking about which originally came from a thing called Flux Architecture from Facebook.
@IsaacHarrisHolt
@IsaacHarrisHolt 6 күн бұрын
Interesting! I do think that, while the idea behind Redux was good, there are better alternatives in the React space that fit React's rendering model better. It works well in Lustre and Elm because they were built from the group up for this approach, but iirc Redux would cause a lot of unnecessary rerenders
@naranyala_dev
@naranyala_dev Ай бұрын
tailwind, tailwind, tailwind
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It's great! Pairs really well with Lustre
@SootuKoll
@SootuKoll Ай бұрын
I'd pay for an Udemy course on this.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
You won't need to! It's all gonna come to KZfaq :)
@Liamtft
@Liamtft Ай бұрын
Github code is 404'd :(
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I forgot to merge the PR! All sorted :) Thanks for calling me out
@Abdo-zi7bz
@Abdo-zi7bz Ай бұрын
Isn't this extremely slow though? Productivity wise I mean. What you did in the first 8 minutes could be done in a minute using any modern JS framework.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
That's because in the first 8 minutes I was exploring the core concepts and building up to an application with effects. In reality you'd go straight into building your model and so forth. This video is meant for learning, not necessarily a "here's the step by step guide to create an app from scratch if you already know what you're doing". You'd skip the first few steps, as you would with JS.
@shyrogan2341
@shyrogan2341 Ай бұрын
@@IsaacHarrisHoltthis looks also a bit unscalable in my opinion, having a single massive enumeration for all your messages in your entire app sounds.. bad?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
You'd typically break it down and have one per page that are then encapsulated by one at the top level
@snatvb
@snatvb Ай бұрын
looks interesting, but in real project this architecture doesn't work context and local state really necessary features
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
It does, and plenty of large apps were put into production using Elm. You have to break things down, but ultimately you still have a single model at the top of everything.
@snatvb
@snatvb Ай бұрын
@@IsaacHarrisHolt support of it will be headacke actually. I had expreience with Elm, and to move slower and slower. And hard connections doesn't help. Split system by features too. For instance you can have platform, where is a lot of forms, graphs, chat with clients. You wanna avoid load code for graphs before open the route and etc. You need controll data load and free manually. When I use react - I can write such code, if my branch's created, I load data, when it's removed, it'll be free
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I didn't cover it in this video, but Lustre has a component model you can delegate to if you really need to. It's good for really interactive things like graphs and chats, but ultimately you'd keep your page state at the top level
@snatvb
@snatvb Ай бұрын
@@IsaacHarrisHolt maybe it needs to see for understand how is it good/bad for change opinion. I tried to use Elm and in some time I fell like I am in swamp)) Also there is really hard to do something not in the loop(outside of architecture). Gleam does not have this drawback
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Give it a go!
@myfavouritecolorisgreen
@myfavouritecolorisgreen Ай бұрын
algo rhythm
@JohnSmith-op7ls
@JohnSmith-op7ls 17 күн бұрын
SSR for all the times you don’t need a SPA with offline functionality, WASM for when you do. Enough with awful JS and the endless front end frameworks, libraries, and languages that transpile to JS.
@IsaacHarrisHolt
@IsaacHarrisHolt 17 күн бұрын
JS is not just about having offline functionality, it's about delivering experiences that delight your users, and more importantly, ones that don't frustrate them. I don't wanna have to wait for a server roundtrip to open a modal
@JohnSmith-op7ls
@JohnSmith-op7ls 17 күн бұрын
@@IsaacHarrisHolt If you legitimately have users on very poor connections and a request to the server for interactions are frequent and slow enough to be noticeably worse than downloading a bunch of JS which is probably going to mostly make requests for JSON for most interactions, go for it. Also, SSR frameworks don’t stop you from still using JS for trivial things if you want, it lets you stop using it for the other 90%+. But for non-edge cases, let’s be real here, nobody’s “waiting” on that 20-30ms delay to show some UI element. Especially after you’ve made them wait to download your front end framework and the endless libraries that make up the rest of the stack.
@IsaacHarrisHolt
@IsaacHarrisHolt 16 күн бұрын
I agree about slow connections, but that's why progressive enhancement exists. Also, 20-30ms is unrealistic for anything that also needs a database call, which a lot of things do these days. But I do get your point, however this video was meant to show off Lustre. The next video in the series is good to use Lustre in SSR mode :)
@iKyroja
@iKyroja Күн бұрын
It ain't typesafe if it is compiled to JS
@IsaacHarrisHolt
@IsaacHarrisHolt Күн бұрын
It still is as long as you primarily write your program in Gleam. It's like TypeScript... but better
@iKyroja
@iKyroja Күн бұрын
@@IsaacHarrisHolt Still doesn't make Javascript typesafe ;) It is time for something new...
@crab-cake
@crab-cake Ай бұрын
not a fan of elm architecture. i remember when all of the rust wasm frameworks used to be based on this. they shifted to signals and hooks which is much better.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
If it's not for you, that's totally fair
@rumble1925
@rumble1925 Ай бұрын
Nice, been keeping an eye on Gleam. But the real reason I'm commenting is to say that Pevensie is a uniquely horrible name for a framework :P
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Adding ':P' doesn't make a rude comment less rude 😅 but I'm curious why you think so
@rumble1925
@rumble1925 Ай бұрын
@@IsaacHarrisHolt Two syllable words are best for mind share, or at least something that is punchy, easy to pronounce and remember. I know Gleam community is mainly british but if you are successful you might want to have your stuff easily pronounced and understood by others. Lustre = good. Gleam = Good. Pevensie = Huh? Pensive, pvc, peevency? Also, rude?
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Yeah, I would argue that "I'm only bothering to comment because I think something you've done is horrible in such a way that nothing else is" is not the nicest of ways of phrasing something. On your two syllable point... Laravel.
@rumble1925
@rumble1925 Ай бұрын
@@IsaacHarrisHolt sensitive
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Again, this is just a kinda unnecessary comment? I'm not sure what you get out of it; you're deliberately doing more harm than good
@samuelemmettbray
@samuelemmettbray Ай бұрын
Rust. We use Rust.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Totally fair! But I don't have to fight a borrow checker 😉
@crab-cake
@crab-cake Ай бұрын
@@IsaacHarrisHolt with leptos you don't have to fight the borrow checker
@kollpotato
@kollpotato Күн бұрын
@@crab-cake i had to
@Tirka100
@Tirka100 Ай бұрын
FP concepts are fine, but trying to solve real-world problems solely through pure programming is wrong. Computers are machines with mutable state. Accept it.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
That's exactly why effects exist!
@rogergalindo7318
@rogergalindo7318 Ай бұрын
old man yelling at cloud! lol
@Tirka100
@Tirka100 Ай бұрын
@@rogergalindo7318 guess what is your cloud made of, sweet baby pony
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@Tirka100 a lot of Erlang
@mellowcloud6434
@mellowcloud6434 22 күн бұрын
Gleam has ffi, you can make external JavaScript files that can mutate state of your own gleam files and types Lustre has a JavaScript runtime for their framework that allows mutability via effects
@PaulSebastianM
@PaulSebastianM Ай бұрын
These are not revolutionary techniques. Fable, ReScript, ReasonML, many more existed before Gleam.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Never claimed they were! I was just showing off the Lustre framework
@PaulSebastianM
@PaulSebastianM Ай бұрын
@@IsaacHarrisHolt yeah but a lot content like this hypes it so.
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
I think I tried to provide a fair overview
@aDaily1222
@aDaily1222 Ай бұрын
who said it was revolutionary? he was just showing off some cool tools for a cool new language
@gavr_sas
@gavr_sas Ай бұрын
I hate this gifs so much, all others is great
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Any particular gif you don't like?
@iflux8821
@iflux8821 14 күн бұрын
I find your number of random memes disturbing
@IsaacHarrisHolt
@IsaacHarrisHolt 14 күн бұрын
Thank you, I have quite the collection
@iflux8821
@iflux8821 14 күн бұрын
@@IsaacHarrisHolt please validate your assumption that it’s a good thing
@IsaacHarrisHolt
@IsaacHarrisHolt 14 күн бұрын
I'm a glass half full kinda guy, and I assumed that people on the internet wouldn't go out of their way to try and knock someone down, especially over something small like this, because that would be unnecessary and mean. I prefer to hope that people aren't mean :)
@iflux8821
@iflux8821 14 күн бұрын
@@IsaacHarrisHolt I see it as helping each other to make the world better - the memes don’t contribute to the process, nothing personal. I like the intellectual part of the content but it’s hard to watch most of the time because of them )
@IsaacHarrisHolt
@IsaacHarrisHolt 14 күн бұрын
Understandable. What would you suggest instead?
@fortwentiblazeit4177
@fortwentiblazeit4177 Ай бұрын
ngl I thought I was watching @Fireship
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Is that a compliment 👀
@fortwentiblazeit4177
@fortwentiblazeit4177 Ай бұрын
@@IsaacHarrisHolt Depending on who you ask :))
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
@@fortwentiblazeit4177 and if I ask you? 👀
@precumming
@precumming Ай бұрын
It was going so well until you added tailwind to the project
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
You don't have to use it 👀
@precumming
@precumming Ай бұрын
@@IsaacHarrisHolt I know, it just makes me sad; and I wanted to see how styles would normally be applied to components (The video is fantastic, the tailwind is the only bit that isn’t excellent)
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
You'd just use a normal stylesheet and link it in the way I do with the Tailwind one. Ultimately Tailwind is just being used as a CSS generator here
@precumming
@precumming Ай бұрын
@@IsaacHarrisHolt aha I see, I assume there probably are options available for styled components type of thing - I’ll have a look
@IsaacHarrisHolt
@IsaacHarrisHolt Ай бұрын
Lustre UI might be worth a look
Your backend is too complicated
9:47
Isaac Harris-Holt
Рет қаралды 69 М.
The Weirdest Language I've Ever Seen (I kinda love it...)
58:11
Theo - t3․gg
Рет қаралды 63 М.
🤔Какой Орган самый длинный ? #shorts
00:42
Clowns abuse children#Short #Officer Rabbit #angel
00:51
兔子警官
Рет қаралды 76 МЛН
Despicable Me Fart Blaster
00:51
_vector_
Рет қаралды 26 МЛН
Gleam v1 HAS BEEN RELEASED
27:07
ThePrimeTime
Рет қаралды 158 М.
Errors as Values are the Future
7:19
Isaac Harris-Holt
Рет қаралды 29 М.
The Star Language that will outshine Rust? Gleam
10:33
Code to the Moon
Рет қаралды 27 М.
I never thought I'd use Socket.io ever again
14:02
Dreams of Code
Рет қаралды 87 М.
The Easy Way to Design Top Tier Websites
11:54
Sajid
Рет қаралды 153 М.
The Ultimate Guide to Gleam Concurrency
13:36
Isaac Harris-Holt
Рет қаралды 15 М.
The Right Way To Build REST APIs
10:07
Awesome
Рет қаралды 76 М.
100+ Linux Things you Need to Know
12:23
Fireship
Рет қаралды 868 М.
Rust vs 7 Other Languages You Probably Haven't Tried
8:55
Code to the Moon
Рет қаралды 75 М.
ВАЖНО! Не проверяйте на своем iPhone после установки на экран!
0:19
ГЛАЗУРЬ СТЕКЛО для iPhone и аксессуары OTU
Рет қаралды 6 МЛН
АЙФОН 20 С ФУНКЦИЕЙ ВИДЕНИЯ ОГНЯ
0:59
КиноХост
Рет қаралды 1,1 МЛН
8 Товаров с Алиэкспресс, о которых ты мог и не знать!
49:47
РасПаковка ДваПаковка
Рет қаралды 66 М.
iPhone, Galaxy или Pixel? 😎
0:16
serg1us
Рет қаралды 1,3 МЛН
ОБСЛУЖИЛИ САМЫЙ ГРЯЗНЫЙ ПК
1:00
VA-PC
Рет қаралды 2,3 МЛН