# Proposal for Snappymob Internal Website's Modification & Deployment Workflow

### Assumptions

- The static sites are hosted on AWS S3.
- The static sites are served by CloudFront.
- The Git Repo will be hosted in Github.
- The person doing the modification has basic competency in HTML, CSS, JS, Vue. Depending on what it's trying to modify.

---

### How To Modify

#### No CMS

- The file tree structure should help the editor to find and modify the content
- Creating a new .vue file should create a new page
- Modifying content on source code directly can be a better option, instead of having a CMS to manage the content because :
- We dont have a standardize content, so we have to customize every page
- when we do that, the architecture will get more complex and the effort might not worth it
- it might not help with the whole editting

##### Example:

pages/
--| info/
-----| about.vue <!--- info.snappymob.com/about --->
-----| jobs.vue
-----| people.vue
-----| story.vue
--| portfolio/
-----| index.vue
-----| besmart.vue <!--- portfolio.snappymob.com/besmart --->
-----| saved.vue <!--- portfolio.snappymob.com/saved --->
--| services/
-----| index.vue
--| contact.vue
--| index.vue <!--- www.snappymob.com --->

##### Concerns:
- Nuxt automatically generates routes based on file tree, but does not support subdomain so we might have to customize it ourselves.

#### With CMS

- We could map the content in CMS
- Then user can edit it accordingly
- Non-tech person is able to edit the content

##### Concerns:
- Will it be compatible with A/B Testing? What if we want to a/b test two different content?
- How do we edit the featured box on homepage with CMS?

#### Webflow
- Non-tech person is able to edit the content, might also be able to edit the featured box as well
- We can export the HTML/CSS/JS/assets and import it to Nuxt then deploy

---

### How to Deploy (or if automated, how does the automated deployment works)

#### Steps
1. build it first using `nuxt generate`
2. Push to github repo
3. s3 sync (with specific branch for a/b testing)
4. clear cache in cloudfront
https://aws.amazon.com/premiumsupport/knowledge-center/cloudfront-serving-outdated-content-s3/

##### CodePipeline/CodeDeploy
- Auto deployment when changes is made on GitHub
- Depending on frequency of updates, CodePipeline might not worth the cost