Video: Setting up for File-based Routing [13/21]

Channel: lihautan

关于

Part 1. Client-side Routing with routes definition

============

  1. Match route and render component https://youtu.be/LbOnjXMOK78

  2. History API for client-side navigation https://youtu.be/gSvEOZraFUA

  3. Intercepting link clicks with event delegation https://youtu.be/qMnMT8mFGIU

  4. Listens to the back event https://youtu.be/545r3QcDXPM

  5. Code Splitting and Lazy Loading https://youtu.be/p9dvIOQz-0U

  6. Adding the loading indicator for slower networks https://youtu.be/cjlow9heDDo

  7. Matching routes with dynamic parameters https://youtu.be/Nux9d4-zrvc

  8. Capturing dynamic parameters https://youtu.be/hQHvxWX9I6I

  9. Updating route props by reusing component instance https://youtu.be/GqCrdHRphi4

  10. Advance matching for parameters https://youtu.be/gOMX6ZbCXrk

  11. Rest Parameters https://youtu.be/NC2_pKwId18

  12. Multiple layout components for a route https://youtu.be/ZXujMpPWl4k

Part 2. Generating routes definition from folder structure

============

  1. Setting up for File-based Routing https://youtu.be/2g6laP8_4vc

  2. Extracting routes by traversing the folder structure https://youtu.be/p5E34OczEAc

  3. Extracting parameters from file paths into regular expressions https://youtu.be/N8Z_Z3V6sy8

  4. Finding nested layouts components from the folder structure https://youtu.be/l0J02zv6URY

  5. Specifying parameter matchers in the file path https://youtu.be/6CWttg6iQmE

  6. Ordering routes by its specificity https://youtu.be/1M6qHI7YyLo

  7. Adding names to layouts https://youtu.be/LdYKjY34Euk

  8. Providing page and navigation stores https://youtu.be/JfZ-sWfcUzU

  9. Watch file changes to regenerate route definitions https://youtu.be/tlU9fdmLB98

🎧 Full Playlist https://www.youtube.com/playlist?list=PLoKaNN3BjQX2kY_4kwWrEQTf5VcQi0_Is

🗂 Course files https://github.com/tanhauhau/create-a-svelte-router

🥰 Support me https://www.buymeacoffee.com/lihautan

🔗 Want to learn more from me? Check out these links:

Twitter: https://twitter.com/lihautan

Blog: https://lihautan.com/

Newsletter: https://lihautan.com/newsletter

Discord: https://discord.gg/RbtgYvExVJ

Thanks for watching 🥰 -- with love, Li Hau