Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found
Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found

Submitted

Planet Site using Vue.js 3 and Sass

#animation#sass/scss#vue#vite

@bradleyhop

Desktop design screenshot for the Planets fact site coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Most of this project was pretty straight-forward for me. However, there were several coding design decisions that I made early on that made this project difficult. For example, I first tried using fetch to retrieve a local json file when import works both on the dev and final builds (using Vite); using Vue's v-for attribute for making a list for the menu instead of hard-coding each list item made easy work of the menus; instead of having a page for each planet view and using Vue Router, I instead just made a planet view component since the layout for each planet is the same. What coding design patterns did you find helpful for this project?

Of course, I accept all critique on something I missed from the design and/or code layout clarity/etc. Thank you!

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord