Yun-Hsia: Agile Development: 4 weeks

[yunhsiaho]

Learning Objectives

0. Developing HTML & CSS

• 🥚 VSCode: you can ...
  • [ ] use the LiveServer extension to launch an HTML page in the browser
  • [ ] use autocomplete to begin a new HTML document, create new tags, and much more
  • [ ] use the HTML CSS Support and IntelliSense fo CSS class names extensions to make writing HTML & CSS more efficient
• 🥚 Formatting HTML & CSS: You can ...
  • [ ] use VSCode configurations to format your code on save
  • [x] use npm run format to format all the code in your repository
• [ ] 🥚 Linting CSS: You can use the npm run lint:css script to find mistakes in your CSS, and you can fix the mistakes.
• [ ] 🥚 Validating HTML: You can use the npm run validate:html script to find mistakes in your CSS, and you can fix the mistakes.
• 🥚 Browser Developer Tools: You can ...
  • [x] inspect the source code of a web page using the Sources tab
  • [x] find any part of the web page in the Elements tab of your Dev Tools DOM inspector
  • [x] find the styles for any element in the Elements tab
  • [x] make temporary changes in a web page from the Elements tab to see how they will look

1. Following Plans

• [x] 🥚 Project Definition and Scope: As a group, you can agree on what you are trying to build, and can clearly describe the project using a README and a repository description.
• 🥚 Project Constraints: As a group you can define project constraints by discussing your strengths, weaknesses and context. You can set these types of constraints:
  • [ ] External: constraints that come from outside your group
  • [ ] Internal, Involuntary: constraints that come from within your group, but your group did not decide to have.
  • [ ] Internal, Voluntary: constraints your group decides on to improve the quality of your development process and final software.
• [x] 🥚 Communication Plans: You can work with your group mates to agree on a communication plan to follow during development.
• [x] 🥚 Communicating Challenges: During development you can discuss with your group when ...
  • you are blocked and need help the agreed channels of communication.
  • your schedule or availability changes
  • you are having trouble getting along with each other
• [x] 🥚 Using a Backlog: You can develop from a backlog of features organized by priority:
  • must-have
  • should-have
  • could-have
• [ ] 🥚 Follow a Development Strategies: You can follow a development strategy to understand the code required for must-have user stories.
• [ ] 🥚 Create Issues From a Dev Strategy: You can create issues for user stories in your project based on the development strategy.
• 🥚 Retrospective: Your group can complete a retrospective to ...
  • [ ] assess how well you worked as a group
  • [ ] find ways to improve in the next project
  • [ ] compare your plan to the reality of developing your website
• 🐣 Claiming and Completing Issues: You can claim issues from the TODO column of a project board and ...
  • [ ] track your progress with the project board
  • [ ] develop your code locally on a separate branch
  • [ ] send a PR that passes CI checks and meets the requirements
• [ ] 🐣 Code Review: You can both review a group mate's PR, and productively participate in a review of your own code.
• [ ] 🐣 Match a Design & Acceptance Criteria: When developing your tasks, you can write code that matches the project's Wireframe and meets your issue's Acceptance Criteria.

2. Writing Plans

• [x] 🥚 Write User Personas: As a group you can describing your site's users with User Personas, and you can use the personas to plan your website from the user's perspective.
• [x] 🥚 Write User Stories: Given a working web page, you can describe it with user stories and acceptance criteria for each user story.
• [ ] 🐣 Write a Backlog: After listing all the user stories for a web page, you can organize them into a Backlog by priority: must-have, should-have and could-have
• [ ] 🐣 Create a Prioritized Design: Using your backlog and the original site as a guide, you can create a Wireframe of the site your group will build. You can use different colors and comments to indicate a priority for each component in the Wireframe.
• [ ] 🐣 Write a Development Strategies: You can translate your Wireframe and Backlog into a Development Strategy for the must-have user stories.

3. Adapting Plans

• [ ] 🐣 Adjusting the Backlog: As a group you can agree to changes in the backlog when necessary.
• [ ] 🐣 Adjusting the Design: As a group you can agree on changes to the design during the development process when it becomes clear your old design needs updating.
• [ ] 🐣 Updating the Project Board: You can manage the project board by adding, removing or updating issues when necessary. This includes changing labels, milestones, or assignees when necessary.

Week-1

I Need Help With:

Nothing so far

What went well?

The group work is doing better than last week. Everyone participates, we feel free about sharing ideas and discussing together.

What went less well?

For this week so far so good. It will be nice if we can work faster as the other groups do, but I think it will get better by time.

Lessons Learned

I leant about how to create legit user-personas and wireframe.

Sunday Prep Work

Review the agile development course record.

Week-2

I Need Help With:

Nothing so far

What went well?

I'm getting more and more familiar with all the planning proccess.

What went less well?

Some unexpected trivials happenned this week, so it has been more difficult to organize my time to study.

Lessons Learned

How to write a better README file and retrospective file.

Sunday Prep Work

View the whole video of traversy's loruki rebuild site.

Week-3

I Need Help With:

Nothing so far, but I feel like I should do more exercise to train my teamwork skills, git, HTML and CSS skills better.

What went well?

Our group were fast to divide the project and finish the planning part quickly.

What went less well?

Some of the group members were not very reponsive on slack during the week, so it was more difficult to track the advancement of the project. Also, we were agreed to post our daily progress and feedback on a shared document, but I tend to forget...

Lessons Learned

How to resolve certain linter error. Get used to code sandbox (when using a computer without vs code installed).

Sunday Prep Work

Finish the project and maybe review the git cmd.

Week-4

I Need Help With:

Nothing so far

What went well?

Our team communicate well about the project progress on slack even everyone can't be there for meeting every day.

What went less well?

Nothing so far

Lessons Learned

CSS Property white-space. How to remove cache in the website from inspector.

Sunday Prep Work

Review CSS naming convention.

[sammou00]

@yunhsiaho , where is your check-in for week 3?

[yunhsiaho]

Sorry, I just add it on now

[sammou00]

@yunhsiaho, you will be going to use HTML and CSS for all communing modules except UX/UI