Version Control helps you keep track of which users are using what version of your app.
With native apps, you have to maintain the versioning of your app with each build. Then only you will be able to release the new version of your app to App Store/Play Store.
But how will you maintain versioning for your web apps?
Story Time!
In the early 90’s, there were server side languages like PHP, Java, and JSP, which helped all your users always get the latest version of your web app.
But now Web Apps have reached a new level. Everything is client side! Hence we can take advantages of the concepts like pre-caching, on demand load, rendering meaningful data at the same time, and so on.
But this can also introduce issues if the user always accesses the cached copy of our web app.
Imagine a SaaS company whose end users are not aware of how to use web apps/next generation web apps/PWAs in the right way.
When it comes to modern web apps like PWAs, you cannot ensure that all your users are using the latest copy of your app’s code.
Assume that you have shipped your web app for the first time, and the users have started using it.The app gets cached after the first visit, and thereafter on each repetitive visit the user will get the cached copy of your app until the new version of your apps code is available. Everything works smoothly.
But now assume that after some time, over the next iteration, you added some new functionality to your existing web app and deployed the new piece of code/bundles.
BOOM
How do you ensure that your users are using the latest version of your web app?
How will you identify how many users are still using the old version of your app?
All these questions encourage you to maintain and store the current version of your web app, so that whenever the users are using your app the app version is also getting stored in the DB server.
But the mystery of “How” to maintain versions remains unsolved!
Git Revision Webpack Plugin comes to your rescue if you use webpack for bundling your code.
It is a Simple webpack plugin that generates VERSION
and COMMITHASH
files during builds based on a local Git repository.
Usage
- Add a tag to your commit.
1git tag <tag-name>2git tag v1.0
- Add the following to your webpack config file:
1const GitRevisionPlugin = require("git-revision-webpack-plugin");2const gitRevisionPlugin = new GitRevisionPlugin();
- Add webpack DefinePlugin in your plugins array.
1const plugins = [2 new webpack.DefinePlugin({3 APP_VERSION_INFO: {4 VERSION: gitRevisionPlugin.version(), //returns the output of git- describe command5 COMMITHASH: gitRevisionPlugin.commithash(), // returns last commit hash6 BRANCH: gitRevisionPlugin.branch() // returns the branch name from which the build was run7 };8 })9]
- Now use
APP_VERSION_INFO
anywhere inside your app as it will be globally available.
1console.log('Check App Version ', APP_VERSION_INFO);