The reason why I did this project is twofold: 1. The website of our team website at the time was not very responsiveness-friendly. 2. I just learned Vue2 and looking for a project to get my hands dirty. The project can be divided into roughly 3 stages: Firstly, I set up the routings with Vue Router tool. Secondly, I redesigned the layout of each page and fill in the old content we had. Lastly, I added more inner components in the Team page, so it is easier for viewer to navigate through different subteams. (Note: since this is a demo project, and also due pandemic everything is online we don't have much new content, so I leave only the home page blank.)
1. I hard-coded the responsive navigation bar.
2. I hard-coded a simple carousel to showcase the car models we have with fade-in-fade-out
animation.
This is the first time I construct a multi-page website from scratch. The workflow I was using
is really helpful
to construct a project systematically, especially dealing with many different kinds of content
need to be shown.
Another important take-away of this project is that it builds a solid foundation for making
other projects in the future.
For instance, I am currently learning React and I found that React Router and Vue Router are
kind of similar, even through
I don't remember tha exact syntax of Vue Router, but I know I did something like this before and
I know how it works.
The only thing I need to do it to check out the documentation. And I believe it is a important
skill for developers,
it is ok to forget how to do it exactly, it is important to be aware of that you did something
similar before and know how to
get the information you need from internet or your old code, then make it work. At least this is
how I learn and reinforce
my understanding along the way.