Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 3 years ago

Planet Site using Vue.js 3 and Sass

animation, sass/scss, vue, vite
Bradley Smith•230
@bradleyhop
A solution to the Planets fact site challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

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!

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Bradley Smith's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License