No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README.md

README.md

Deployment checklist

Overview

Before deploying, it's crucial to make sure that the app is in a good state. In order to help determine whether or not that's the case, follow this checklist (and your good sense). Keep in mind that it is highly advisable to use the following checklist as a development guide, so please consider these concerns from the beginning of the project.

Tests

Unit tests
  • All unit tests are passing
  • Testing all relevant parts of the app (mainly reducers, selectors and sagas)
Manual tests
  • All functionalities are working (buttons, links, inputs, etc.)
  • Input validations behave as expected

Relevant Links:

Content

Texts
  • All buttons, paragraphs, headers, etc., have the right content
  • There are no typos
  • No placeholder texts left
Links
  • All routes on a navbar are linking to proper route
  • Brand logo is linking to root url
  • External links are pointing to where they should be
  • Social media links
  • If app is a blog, RSS link is in place
Images
  • All images are being loaded
  • favicon is in place
Helmets
  • Every page/route updates the helmet accordingly

Relevant Links:

Optimization

Bundle size
  • Not using heavy libs to solve small issues, that can easily be fixed with smaller libs or little code
  • If using lodash, make sure to use babel-plugin-lodash
  • If using ramda, make sure to use babel-plugin-ramda
  • If fonts are being loaded with url-loader, make sure to optimize their size
  • If using url-loader, make sure to specify a limit (if file size is greater than limit, will be loaded with file-loader)
React performance
  • There are no inline styles
  • Rendering multiple components does not take more than 100ms
  • Pages transitions are smooth
  • Components/containers are not re-rendering when they are not supposed to
Images
  • Make sure all icons are in SVG
  • Remove unnecessary parts from SVG
  • SVGs are components
  • Verify if all image files are compressed
  • Make sure you are using image-webpack-loader, since it comes with built in optimizers for .gif, .jpeg, .png and .svg files.

Relevant Links:

Accessibility

Images
  • All non-textual elements have alt attribute
Semantic Tags
  • Instead of using <b>, you're using <strong>
  • Instead of using <i>, you're using <em>
  • Using role attribute when relevant. E.g.: <nav role="navigation">
Keyboard Navigation
  • Browser's keyboard shortcuts are not overwritten

Relevant Links:

Functionality

Buttons
  • click actions are behaving as expected
  • Styles for hover, active, etc., are behaving as per design. If it's missing in design, contact your designer :)
Forms
  • Validations are working as should
  • Visual feedback for invalid values are in place
  • Verify :-webkit-autofill behavior
  • Submitting form on enter
  • tab navigation
Navbar
  • All the routes on navbar are directing to right location
Animations
  • All animations are working correctly
  • All (screen) transitions are working correctly
External API errors
  • Visual feedback for when an API error occurs
  • Toast notifications?
  • Modals?
Page not found
  • The app correctly handles the case when users try to access URLs that do not exist
  • 404 page?
  • Redirect to home page?

Responsiveness

Responsive behavior
  • App correctly adjusts to different window/screen width breakpoints
  • App layout does not break with different heights
  • App works properly in all target devices, both in landscape and portrait mode

Relevant Links:

Cross-browser

By default we support the two latest versions of a browser. Be sure, it works everywhere. For real device testing (in Prague), please contact @jakubkaspar for iOS and @leosdostal for Android devices.

Cross-browser behavior
  • Functionalities
  • App works as expected on relevant browsers, both on Mac and PC
  • Responsiveness styles are applied to all relevant browsers correctly

Emails

  • All HTML emails look as expected in relevant email clients and devices
  • Appropriate preheader text is set for each email

So, what's next?

After you go through this checklist and conclude your app meets all the above rules suggestions, you're probably good to go. Just use your good sense to verify for points that are specific to your project and may not be described above. The important thing is to feel comfortable with the state in which your app is.

You can also check the following checklist: https://weblaunchchecklist.com/