Coding workflow

coding workflow

ref1

frontend

1. mockup in photoshop (output)

• design
• define output

2. componentize

• break it into small parts

2.1 separate dynamic and static components

• dynamic = will change without interaction with backend (? does redux take this away?)
• static = only outputs stuff from backend

3. build static components

• e.g. in React (tut codepen)

Now that you have your component hierarchy, it’s time to implement your app. The easiest way is to build a version that takes your data model and renders the UI but has no interactivity. It’s best to decouple these processes because building a static version requires a lot of typing and no thinking, and adding interactivity requires a lot of thinking and not a lot of typing. We’ll see why. - Dan Abramov of Redux and create-react-app

backend

1. write output, either as json or other

• define output