Video Belajar
Tonton dan pelajari berbagai topik menarik melalui video pembelajaran eksklusif dari Channel Coding in Public.
Coding in Public
8153
(NEW!) Optimize Image Features in Astro 3.0
Join the early access list for my course! https://learnastro.dev
Astro can optimize images in your src directory, preventing layout shift, reducing loading time, and more. Astro provides two tools: 1) an Image component and 2) a getImage function for server renders.
🔗 Key Links 🔗
- Docs: https://docs.astro.build/en/guides/images/
- Github: https://github.com/coding-in-public/astro-image-optimization-v3
---------------------------------------
⏲️ Timestamps ⏲️
0:00 Introduction
1:00 Image component
5:12 Public or remote images
8:35 Markdown optimization
11:33 getImage function
14:04 Creating responsive optimized images
---------------------------------------
🎨 VSCode Theming
- Font: Cascadia Code: https://github.com/microsoft/cascadia-code
- Theme: https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-community-material-theme
- Icons: https://marketplace.visualstudio.com/items?itemName=BeardedBear.beardedicons
---------------------------------------
🌐 Connect With Me 🌐
- Website: https://codinginpublic.dev
- Blog: https://chrispennington.blog
- Twitter: https://twitter.com/cpenned
- Patreon: https://www.patreon.com/coding_in_public
- Buy Me a Coffee: https://www.buymeacoffee.com/chrispennington
Astro can optimize images in your src directory, preventing layout shift, reducing loading time, and more. Astro provides two tools: 1) an Image component and 2) a getImage function for server renders.
🔗 Key Links 🔗
- Docs: https://docs.astro.build/en/guides/images/
- Github: https://github.com/coding-in-public/astro-image-optimization-v3
---------------------------------------
⏲️ Timestamps ⏲️
0:00 Introduction
1:00 Image component
5:12 Public or remote images
8:35 Markdown optimization
11:33 getImage function
14:04 Creating responsive optimized images
---------------------------------------
🎨 VSCode Theming
- Font: Cascadia Code: https://github.com/microsoft/cascadia-code
- Theme: https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-community-material-theme
- Icons: https://marketplace.visualstudio.com/items?itemName=BeardedBear.beardedicons
---------------------------------------
🌐 Connect With Me 🌐
- Website: https://codinginpublic.dev
- Blog: https://chrispennington.blog
- Twitter: https://twitter.com/cpenned
- Patreon: https://www.patreon.com/coding_in_public
- Buy Me a Coffee: https://www.buymeacoffee.com/chrispennington