This project is for sketching out somekind of succesful project management guide/instruction/template/cheatsheet/process/way of doing things from start to finish, you name it. At least for me it has always been kinda hard to know how to start a project, what are the first steps to take, how to proceed with a plan, what agile actually is, how to deal with the customer, how to finish the final and product and deliver it to production. The coding part which lies somewhere in the middle is the most "easiest" part I think. But come up with somekind of plan and actually know what we're doing/we're are we going is the trickiest part.
This thing is going to evolve a lot, hopefully as time passes, while I can find good resources, have aha moments, and have a nice talks with people. Hopefully I can come with somekind of easy to digest, high level concept that I can use and share in future endeavours.
This first draft is heavily based on to this wonderful article about creating a JS app from a scratch:
## Table of contents * [Step 01: Ideate/brainstorming/QA](#step1) * [Step 02: User stories (the features)](#step2) * [Step 03: Domain model (the business)](#step3) * [Step 04: Wireframe UX/UI](#step4) * [Step 05: Build a proof of concept (POC)](#step5) * [Step 06: Embrace agile workflow](#step6) * [Step 07: Start working with the UX/UI design](#step7) * [Step 08: Set up version control](#step8) * [Step 09: CI/CD pipeline & environments](#step9) * [Step 10: Tooling](#step10) * [Step 11: Code out the features](#step11) * [Step 12: Finalizing](#step12) * [Step 13: Deploy the live app](#step13)
### Step 1: Ideate/brainstorming/QA - Question: What we exactly want to build? - It's the most difficult question - You have to remind this for yourself for the whole project lifetime - These are the requirements/specs - Things that everybody are asking - Question: To whom you're building the app? - Hackathon, home project, no specific idea yet? - Gather ideas you’re excited about - Maybe a past app you've been thrilled about? - Post it brainstorming strategy - Scribble out as many ideas as you can - Even ”stupid” ones - Brains keep moving - Voicing ideas out of fear - Never fear opening your mouth to say something - Sort ideas to categories - You will find themes - Find connections between them and you may have an high level idea of the app? - Real customer - Has some kind of vision? - Have a QA meeting - What the customer really wants? - Usually they don't know it - Only a big picture - Listen to the customer and write down features - Gain user stories/use cases - Ask question, a lot - Propose your own thoughts also - Listen to the nouns customer is using - You might find domain entities - Ask what are the most important features they want to have on it? - Plan MVP - Maybe not in the first QA - Repeat ### Step 2: User stories (the features) - Write down user stories - These are the features of the application - Naturally the first ones might be epics (long user stories) - Try to crush em` down - Put user stories under epics ### Step 3: Domain model (the business) - Based on user stories, create domain model - A list of entities and their attributes - Find and form relationships between the entities - Find business rules ### Step 4: Wireframe UX/UI - Draw raw basic view(s) of the app - Incorporate user stories so you can understand how the views work - If possible, make friends with a designer or hire one or ask your boss to hire one ### Step 5: Build a proof of concept (POC) - Create proof of concept of the most difficult fundamental features of the app - This demonstrates that the it can actually be done ### Step 6: Embrace agile workflow - Stay organised by practicing agile development - Scrum - If you know what to do next two weeks - Kanban - You're not sure what is coming up - No need to follow any strict style of doing things - Create agile board - A real whiteboard - Use tools if necessary - Create backlog - List milestones (sprints, MVP, production ready etc.) - List themes (A collection of related user stories) - List epics (large user story) - List user stories - Tasks underneath them - In Github you can list tasks to do with checkboxes - Split user story for frontend and backend - List bugs - Other things to do - Have an "icebox" - A column for future features, wacky ideas - Hold stand-up meetings - Have discussion about - Previous day's progress - Encountered blockers - What to do next - Prioritise prioritise! - It's important to proceed with the most important things - Iterate iterate! - For every sprint try to deliver working application - Try not to do everyting at once but with small steps - Learn to say NO and what is not actually possible - Estimate with half-a-day, a day and two days - Not in hours - Have retros - Refine ne process during the journey ### Step 07: Start working with the UX/UI design - Start working with the actual UI design - Create a styleguide - Unified feeling throught the whole app - Ask help from a designer - Tell your boss you need a real UX/UI designer ### Step 8: Set up version control - Set up Github/etc. repo for the code - Prevent merging to master - Force reviewing each other's code - Code review - Create git branches from user stories ### Step 9: CI/CD pipeline & environments - Have CI/CD pipeline right from the start - Automatic builds - Tests - Code analysis - Deployments - Create dev/staging environments where you can demo your progress with the app ### Step 10: Tooling - Choose tools & frameworks for the project - Try not to reinvent the wheel ### Step 11: Code out the features - It's coding time! - Decide architecture - Embrace package by feature - Monolith or microservices application? - Start implementing the functionality of the app - Pick a user story - Remember to make a branch - User wireframe/design as your guide - If any questions, collaborate with the customer - Don't forget to do tests! - TDD, BDD - Unit tests - Integration tests - End to end tests ### Step 12: Language support, texts, content - Who decides the UI texts - Labels - Warning - Alerts - Content in general - Centralised lang file? - Create a service? ### Step 13: Finalizing - When the MVP of the functionality is done, clean it up and make it look nice! - Fix bugs - Try to simulate every user flow - Might not be the most systematic phase - Switch to Kanban? ### Step 14: Deploy the live app - Reuse settings from existing environments
- If possible always try to work something/progress and then gain feedback. It’s better to have something to work with and make better than a blank paper
- You cannot refactor if there is no tests
- Fear of braking up things
- This would be ideal
- Unawarness is your worst enemy
- Embrace: app first, tech second
- Example user stories:
- ability to create new goals, milestones, and checkins
- ability to delete goals, milestones, and checkins
- ability to change a timeline’s name, color, and details
- ability to zoom in on timelines
- ability to add links to resources
- ability to upload media
- ability to bubble up resources and media from milestones and checkins to their associated goals
- rich text editor integration
- user signup / authentication / OAuth
- popover to view timeline options
- loading screens