x
x
GLOBAL • TECHNOLOGY
Luis Rodrigues
JULY 5, 2017
At Seedstars Labs, we have been building web products since 2012 and have kept refining over time our methods and tools. Because sharing is caring we wanted to share our best practices and tools with those who are eager to learn.
Since not all browsers support the ES6/ES7 (javascript future versions) we use babel to transpile the ES6/ES7 javascript to javascript that all browsers can run.
This tool allows us to use the new features of javascript, which are a real time saver and also makes our code more readable and structured.
Webpack is a module bundler for javascript – this is a simplest explanation and it hides a bit the power of webpack.
Webpack manages all your frontend code, you can use it as task runner that works just like gulp. Instead of just giving an output, as gulp, webpack manages tasks, which libs will be loaded and dependencies making your site faster.
Webpack is really crucial when developing a big scale project.
Some of the task runners:
Structuring your code and keeping it consistent is very important when you are working in a team. We use the Airbnb style guide because it is the one that is closer to our way of thinking/coding.
If you haven’t heard about React, we recommend to give it a look. It’s one of the most used frontend frameworks and a game changer for the development world (components are the future of the web)!
Extremely efficient and flexible, the fact that it creates its own virtual DOM give us amazing performance gains. Having a great community that maintains and develops new libs and features is also extremely important for us. One of the main features in React is the way the code is structured turning the development in a team environment more consistent.
We also use React Native for mobile development which give us the ability to reuse code across platforms.
Managing the state in an app can be a huge mess. In Redux you create a global state that contains the app state. Instead of having the need to pass states through props(in React), you just dispatch actions that will affect the global state. With Redux this global state is accessible in any view making the information flow easily across components.
This tool allows you to see the Redux state when using the app
Ruthlessly simple bindings to keep react-router and redux in sync – there is no more that we can say here 😉
Router is like a map of your pages so when you say “contact” it knows that you want to render the contact page. This lib syncs the router info with redux so your state knows in which page you are.
React Native is the “secret” we use to be able to deliver fully working mobile apps in a few days/weeks. It leverages the power of React to create and manage native Android and iOS components in a very simple and intuitive way by using Javascript.
Django is a free and open-source web framework, written in Python, which follows the model-view-template (MVT) architectural pattern. We build all our backend code and some of our websites using it.
Django REST framework is a powerful and flexible toolkit for building Web APIs.
With a couple of lines of config, WhiteNoise allows your web app to serve its own static files, making it a self-contained unit that can be deployed anywhere without relying on nginx, Amazon S3 or any other external service. It’s designed to work nicely with a CDN for high-traffic sites so you don’t have to sacrifice performance to benefit from simplicity.
Prospector is a tool to analyse Python code and output information about errors, potential problems, convention violations and complexity. It’s aim is to be useful ‘out of the box’.
It brings together the functionality of other Python analysis tools such as Pylint, pep8, and McCabe complexity. The primary.
Bandit is a tool designed to find common security issues in Python code. It is the security linter from OpenStack Security.
The pytest framework makes it easy to write small tests, yet scales to support complex functional testing for applications and libraries.
Mock is a library for testing in Python. It allows you to replace parts of your system under test with mock objects and make assertions about how they have been used.
A utility library for mocking out the requests Python library.
We use the agile methodologies and work in continuous deployment environment. As we have lots of teams in remote we use the following framework to ensure that communication is never compromised.
We use Kanban to better match the amount of work in progress to the team’s capacity. This gives teams more flexible planning options, faster output, clear focus and transparency throughout the development cycle.
This is achieved by using a virtual board, it’s function is to ensure the team work is visualized and their workflow is standardized. A basic kanban board has a three-step workflow: to do, in progress and done. This is prioritized by the product manager which selects new tasks from the ones that are on the backlog.
We work in sprints of 2 weeks, the two weeks are dedicated to “stuff that moves the needle”. Although we do CI/CD we use these two weeks cycles to make sure team is aligned in the business objectives .
The Product/Tech, Business and Growth team members work together to create a great product. Having input from everyone is extremely important for our success. We don’t want silos or “us vs them” mentality, everyone is together to achieve a goal and everyone is important and their opinion matters.
We use daily stand ups to keep everyone in sync. The meetings are timeboxed (at most 15 minutes) and take place with participants standing up to remind people to keep the meeting short and to-the-point. Everyone answers the questions: “what I did yesterday?”, “what I’ll do today?”, “what issues I have?”. This is not a problem solving meetings but can be used to make problems visible. Any problem to solve should be taken care off line.
We use the Objective and Key Results methodology to keep our business and dev teams aligned on the same priorities. We keep the business priorities in a Trello board (you can find a template here), and the product log in a google doc (simplicity works best) that is always at hand, pinned in that Trello Board.
For asynchronous communication, Slack is best. All our teams are just one slack away and it makes it easy to communicate.
This is hands down the VoIP service that works the best after having tested virtually all of them. This is the only tool that guarantees good voice quality in the markets we work.
Code Review & Tests:
This is a very important part of the way we work. Code reviews can often find and remove common vulnerabilities help improving software security. Are also useful for new developers to pick up the way other more senior developers solve issues and use libraries.
All code in our repositories has 100% backend coverage and some essential frontend tests. As backend contains all business logic we believe it is essential to have it properly covered!
Our code review and CI/CD pipeline is implemented using the great open source tool GitLab.
