(or: How we work at Usersnap)
We – as a company providing a visual bug tracking tool which makes life for developers and everyone involved in web projects a lot easier – put a lot of thoughts into the field of bug-free development environments.
In this post I’m going to show you how we have set up our own development environment.
Why bug-free?
I guess the question is obvious. We think a lot about the perfect setup for our developing processes (see next chapter). When it comes to testing, QA and ensuring a bug-free environment, most developers lack creativity.
However, people rely on our work. Bugs don’t make our clients or website visitors happy. Neither are we. By setting up a bug-free environment, you can ensure that everything works right at the beginning.
Setting up the development machine
Every developer has a tool set which makes his/her life a lot easier. Over the last years, since starting Usersnap, we have developed our very own setup, which is described below.
The basic tools
We try to optimise our development workflow continuously and it isn’t something which is starved in stone. It can be quite difficult in the beginning to choose the right tools. We – at Usersnap – work on Linux, as well as on Windows 7 and OS X. With this variety of OS we can ensure local tests on a variety of systems and browsers.
We basically work with Chrome and Firefox. The built-in web dev tools do come in handy in a lot of stages. Especially for Chrome there are great web dev extensions out there which makes life a lot easier.
Browser-wise there are also great web services available which let you render in older/other browsers as well.
The Editors
When it comes to editors, there are a great variety of coding editors available.
Besides well-known editors like Sublime Text 3, we also use Eclipse and PyCharm as full-fledged IDEs and vim. With version control and change tracking, these editors are pretty convenient and let you focus on the real task. Full context sensitive search features provide great productivity boosts too. Further on, Coda and Notepad++ are our tools to go when working on small changes.
Since there are a couple of developers working on the same projects here at Usersnap, it’s important to us that all editors have the same auto-format rules. This means that an auto-formatting run by developer A should not lead to a different format result in the editor of developer B.
Version Control Software
Version control plays an important role in our dev process. We use Git and subversion as our version control system of our choice. Although git is the version control software to go in most cases, having a clear and central version numbering scheme with subversion has its benefits too.
Pro tip for your version control software: Use a specific branch of your version control software to trigger releases, tests and deployments.
Bug tracking tools we use
Developing and distributing your own bug tracking software comes in pretty useful for our development workflow itself. Of course, we use Usersnap for our internal bug tracking workflow too. Besides bug tracking, we also use it to communicate on change requests and new (marketing/ customer care/ product) ideas. Everything is stored in our Usersnap project dashboard.
trac, Slack & Usersnap
Usersnap works as a stand-alone bug tracker, as well as in combination with other tools. To get even more out of our bug tracker, we’ve connected it with Slack & trac.
With that connection enabled, we get notifications about new bugs & change requests directly inside our Slack channel. Fast actions are key when it comes to critical bugs, which is why this integration made us even faster. We do also use trac as our ticketing-/bug tracking tool. It’s great for keeping track of all your issues and software bugs inside trac.
Further tools
There are a couple of no-brainers which makes life of our developers easier:
QA & testing workflow
After I’ve shown you our development setup, it’s time to think about quality assurance & testing when it comes to a bug-free environment. There are a couple of hacks which we use on a daily basis and which may help you too.
Setup test
Setting up a software or website test requires some basic answers regarding your aim, as well as your defined target group.
Testing your web app or website, which you or your developers have coded before, requires a general understanding of the identified need, defined specifications and crafted designs. The best testers are those who got involved in the project right at the beginning of it.
Review Code
Recently, I spoke with the CTO from an European startup about the QA processes and how the development team are the first testers and reviewers of any new code. The conclusion for me was, that “four eyes see more than two”, meaning that other developers (from the same team) should review the source code from his/her colleagues before the website/app is tested by the QA team. Having a lean, and open-minded feedback culture in your team will definitely make your product better.
Automate Tests
Automating your testing workflow sounds great. No human interaction & resources are required. Tools like Saucelabs or Ghost Inspector crawl your website or web app for bugs and issues and deliver reports on any new errors. This works especially great if you’re testing the functionality of your product. However, automated browser tests won’t solve usability issues of your website or app.
Concerning these usability issues we do conduct user tests on a regular basis. Therefore, we use services like uTest.com or UserTesting.com.
Customer Feedback
Honest feedback from our truly awesome customers is one of the most important brick in building a successful product. We try to get as many touch points with our clients as possible. Besides providing a great customer support experience we try to show openness on a variety of channels:
- We offer help to people who are signing up for a Usersnap trial
- We ask our customers small, but specific questions via email and in-app messages
- We have a questionnaire – set up with Google forms – asking some further questions
- We conduct extensive, qualitative interviews with customers and record these interview sessions.
Use proven code…
…but do not steal from others. Especially when creating a new website or a new product, you don’t have to start from the scratch in regards to source code. There are great & mostly free libraries, such as snipt or GitHub, available which will help you to build something new. As a great benefit, those code snippets are most likely bug-free.
Prepare to fail
Well, you’ve probably heard the common phrase that “failure is a necessary part of success”. Failing is absolutely fine, but when you always end up fixing high priority bugs in your code, chances are that you’re not going to be successful soon 😉
The key of failure is that you (and your team) are prepared for that. Finding bugs & issues in your product is one thing. Having a backup plan on how to deal with these situations is something different. Having a powerful, yet flexible and agile bug tracking workflow will help you dealing with failure.
Wrapping it up
Well, the idea of a bug-free environment is great, since it helps you to stay on track building the right things. You should definitely put a lot of effort & time in setting up your development environment. Will it be bug-free? Probably not. But when problems arise, the mentioned setup & tips make solving these problems relatively quick.
This article was brought to you by Usersnap – a visual bug tracking and screenshot tool for every web project.
Resolve issues faster with visual bug reporting.
Simplify and reduce issue & bug reporting efforts with screen recordings, screenshots, and annotations.
And if you’re ready to try out a visual bug tracking and feedback solution, Usersnap offers a free trial. Sign up today or book a demo with our feedback specialists.
