What makes a web application “modern” in 2019

  • ESLint/TSLint
    Using a linter will make sure coding conventions are respected, and enforced. Sterile arguments such as tabs vs spaces or how many spaces constitute a tab can be snipped by adopting an external style guide like AirBnb’s JavaScript Style Guide, Google’s JavaScript Style Guide and the many TSLint rules available. Enforce consistent formatting using Prettier. Prevent developers from pushing code that is not linting using Husky and lint-staged. Settle opinion wars and avoid the highest paid person’s opinion (HiPPO) by voting in a Slack channel if rules need to change.
  • Unit Tests with Jest
    Jest is my favorite test runner at the moment, because it plays well with Enzyme and React, comes with its own BDD style assertions, out of the box coverage, and opens the door to Snapshot testing. I again highly recommend using Git Hooks (with Husky) to enforce high code coverage and 100% passing unit tests before allowing code to be pushed.
  • Component Driven Development and Component testing with Storybook
    Storybook is a powerful and easy to learn tool for component driven development. Instead of building screens, developers create components, and assemble them to create screens. Storybook allows for Structural Testing which allows to create and maintain a suite of unit tests that will actually fail should the layout of the web application change. This minimizes the amount of visual defects and allows developers to check for them prior to opening a pull request, and before the code is deployed. Storybook also enables Interaction Testing, Automated Visual Testing and Manual Testing. Quality engineers love this. Product owners can play with components without pestering the development team for a demo and provide UX/UI feedback at their leisure, so valuable demo time can be used to discuss feature enhancements rather than UI glitches.
  • Integration and End2End tests with Cypress
    The days of hard to write and flaky tests with Selenium are over. Set up and write tests in minutes using Cypress, and run them in a matter of minutes both locally prior to pushing code and on a CI/CD environment. Stop repeating the same handful of steps while testing a new feature, and just have Cypress do it faster and more accurately than any manual testing could ever be.
  • Experiment
    It is estimated that 80% of new features have a neutral or negative impact on users. Use Feature Toggles and A/B Testing to assess the impact of new features on your website. Do not be afraid to kill a new feature that took a long time and a lot of effort to build if it has a negative impact. What most would consider a failure should be treated as a successful market study, draw some lessons from this experience and move on.

--

--

--

Previously Paris and Geneva, currently New York. Can also be found at https://dev.to/arnaud

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How we repurposed NPM to publish and distribute our Go binaries for internal CLI

Vue — close menu when user clicks away

Create a MySQL Database Middleware with Node.js and Async/Await

Infrastructure as Code in TypeScript with Pulumi

Problem Solving with JavaScript

I am getting cheaper pricing for hosting from other providers. Why is your price high?

How to calculate Big O

Using TailwindCSS In The World Of React

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Arnaud Dostes

Arnaud Dostes

Previously Paris and Geneva, currently New York. Can also be found at https://dev.to/arnaud

More from Medium

Writing Unit and Integration Tests in React

React Code Architecture

Finding Work: A leap of faith

React: Components, Hooks and State