Assignment - Migrate legacy frontend to Vue

Scenario

There is a legacy website written in PHP without any framework and the codes are quite messy.
After a long deliberation, team leader decides to use Vue as the frontend framework for better development experience.

You are now an employee of the company, as a frontend engineer, your first mission is to do the code refactoring and try to migrate the existed functions written in JavaScript / jQuery to Vue.

Target

1. Extract CSS and JavaScript into external files. You can decide folder structure to store them.
2. Migrate existed JavaScript / jQuery functions to Vue with version 2.x.
3. Use Vue to perform API call in order to get movie data instead of loading local JSON file.
   • API Endpoint - https://hw-web-api.herokuapp.com/api/movie/list.php
4. (Optional) Use Vue to implement form validation. Make sure each textbox meet its requirement, otherwise show error message in Red under it.
   • Title in Chinese - Required. String length must between 1 to 50.
   • Title in English - Required. String length must between 1 to 100 and cannot include the symbols $, %, ^, &, *.
   • Intro - Required. String length must between 10 to 255 and need to start with Intro. e.g. Intro: This is ..., Intro, Once upon....
5. (Optional) Use one of the frontend tools to manage static files. For example, use Webpack or Bower to manage bootstrap and jQuery. Describe what tool you use and how you setup.
6. (Optional) Find any weakness/risk in this application, describe the weakness/risk and how you fix it.

Deliverable

1. Upload codes to your GitHub and provide repo URL.
2. (Optional) Host your codes on any cloud service, e.g. Heroku, Amazon Web Serivce (AWS), Microsoft Azure, Google Cloud Platform (GCP), and provide site URL.
   • Here is the example on heroku: https://hw-frontend-migrate-vuejs.herokuapp.com/
   • If you are using AWS / Azure / GCP, describe what services you are using.

Notice

• Once you finished the assignment, send an email back to the one who contacted you.
• Leave comments to README.md in the root of your repo.
• Describe details to README.md if you completed Target#4, Target#5 or Deliverable#2.