Introduction

I’ve been a web developer for almost 12 years, and in that time, I’ve tried just about every workflow you can imagine. The following is my current and preferred workflow, which has evolved over the years — and a lot of trial and error! In this post, I’ll outline my workflow and why it works so well.

1.   Planning

• Define the problem.
• Understand the requirements.
• Create a task list based on those requirements. My favorite tool for this is ToDoIst. It’s an easy-to-use to-do list application with many different features.

2.   Coding

• Visual Studio Code to edit code.
• Git version control to track changes to my code.
• Use Terminal to run commands, such as git status, npm install or gulp.

3. Testing and code review

• QA testing. Test my code and ensure it works on all browsers and multiple devices using Inspect tool.
• Code review (and analysis). Use Google Page Speed Insights to ensure that the site is fast loading and accessible.

Takeaway:

• My web development workflow is always a work in progress, which changes as tech changes. Having a workflow will make the project get completed in a more organized manner.

A summary of the tools I use in my workflow.

• Visual Studio Code for editing code.
• GitHub for tracking code changes. Every developer should be using version control.
• Terminal and Node.Js for building projects locally using package managers like npm and yarn
• Firefox Developer Edition for viewing projects, debugging and cross-browser checking using the Inspect tool.
• ToDoIst for managing project todos.
• MAMP for local WordPress Development
• Figma and Photoshop for viewing design mockups to convert to website.
• Slack and Docker for communication

Conclusion

I hope you found this post helpful and informative for developing your own workflow. Please contact me if you have any questions or need any help with web development projects.