$30 off During Our Annual Pro Sale. View Details »

Intro to Astro

Avatar for Dimitri Dimitri
March 14, 2023
Programming
0
150

Intro to Astro

This presentation contains an introduction to Astro by creating a Pokédex using the PokéAPI.

Avatar for Dimitri

Dimitri

March 14, 2023
Tweet

More Decks by Dimitri

See All by Dimitri
Moduliths
Avatar for Dimitri g00glen00b
0
120
Tech talk: Micronaut
Avatar for Dimitri g00glen00b
0
220
Better monitoring with Spring boot Actuator
Avatar for Dimitri g00glen00b
0
330
From WordPress to Gatsby
Avatar for Dimitri g00glen00b
3
390
GraphQL
Avatar for Dimitri g00glen00b
1
280
Reactive programming with Spring boot 2
Avatar for Dimitri g00glen00b
1
400
Introduction to Meteor
Avatar for Dimitri g00glen00b
0
460
JavaScript essentials
Avatar for Dimitri g00glen00b
3
430
Fronteers - JavaScript at your enterprise (Dutch)
Avatar for Dimitri g00glen00b
0
220

Other Decks in Programming

See All in Programming
なあ兄弟、 余白の意味を考えてから UI実装してくれ！
Avatar for Ryomm ktcryomm
10
11k
エディターってAIで操作できるんだぜ
Avatar for kis9a kis9a
0
640
Reactive Thinking with Signals and the new Resource API
Avatar for Manfred Steyer manfredsteyer
PRO
0
160
WebRTC、 綺麗に見るか滑らかに見るか
Avatar for sublimer sublimer
1
140
CSC305 Lecture 17
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
270
レイトレZ世代に捧ぐ、今からレイトレを始めるための小径
Avatar for ichi-raven ichi_raven
0
490
大体よく分かるscala.collection.immutable.HashMap ~ Compressed Hash-Array Mapped Prefix-tree (CHAMP) ~
Avatar for matsu_chara matsu_chara
1
210
GeistFabrik and AI-augmented software development
Avatar for Ade Oshineye adewale
PRO
0
250
Level up your Gemini CLI - D&D Style!
Avatar for Riccardo Carlesso palladius
1
170
目的で駆動する、AI時代のアーキテクチャ設計 / purpose-driven-architecture
Avatar for MinoDriven minodriven
11
3.9k
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
Avatar for Chris Richardson cer
PRO
0
250
著者と進める！『AIと個人開発したくなったらまずCursorで要件定義だ！』
Avatar for yasuna yasunacoffee
0
110

Featured

See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
120
20k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.1k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
285
14k
Done Done
Avatar for chrislema chrislema
186
16k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
1
73
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
960
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.9k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.6k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
527
40k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.3k
Side Projects
Avatar for Sacha Greif sachag
455
43k

Transcript

  1. Intro to Astro

  2. 👋 Who am I? • Dimitri “g00glen00b” Mestdagh • Full-stack

    developer at Optis • Works with Java and JavaScript • https://dimitri.codes • @g00glen00b

  3. 🚀 What is Astro?

  4. Key features • SSR / SSG framework • Integration with

    React, Vue, … • Server first • Zero JavaScript by default • Multi-Page Application

  5. Why SSR / SSG? Client-Side Server-Side Static Site Fast build

    time Dynamic content Interactive Good SEO Fast page serve ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔

  6. Why zero JavaScript? • No hydration • Less compute-heavy for

    browsers • Better performance • Less bandwidth • Astro Islands

  7. 󰳕 Live coding time!

  8. Conclusion

  9. Personal thoughts • Great Development Experience • Mind-switch SSG/MPA •

    Minimal IDE support

  10. Resources Code: https://github.com/g00glen00b/astro-pokedex

  11. Resources Blogpost: https://dimitri.codes/astro-pokedex/

  12. 🙏 Thank you for listening!