How to do app versioning in create react app?

In projects built with Create React App (CRA), implementing application version control typically involves several strategies and tools, including version number management, source code management (such as Git), and automated deployment with version tagging. The following sections detail these aspects:

1. Version Number Management

In the package.json file of the project, the version field specifies the current application version. This version number should follow the Semantic Versioning (SemVer) principle, with the format typically being major.minor.patch. For example:

• Major version: When you make incompatible API changes.
• Minor version: When you add downward-compatible new features.
• Patch version: When you fix downward-compatible issues.

Before releasing a new version, developers should update this version number based on the nature of the changes.

2. Source Code Management

For source code version control, Git is commonly used. Initialize a Git repository at the start of the project and manage different development stages through continuous commits. For example:

bash
 git init
 git add .
 git commit -m "Initial commit"

During development, use meaningful commit messages and record significant changes or new releases with tags. For example:

bash
 git tag -a v1.0.0 -m "Release version 1.0.0"
 git push --tags

3. Automated Deployment and Version Tagging

For projects with frequent updates, automated deployment can be achieved using CI/CD (Continuous Integration and Continuous Deployment) tools such as Jenkins, Travis CI, and GitHub Actions. After each code commit to the main branch (e.g., main or master), CI/CD tools automatically run tests, build the project, and deploy to production.

Additionally, add steps to the CI/CD pipeline to automatically update the version number in package.json, create tags, and push to the Git repository. This ensures each deployment has clear version tagging and records.

4. Using Version Control Tools

Tools like standard-version can automate version number management and change log generation. standard-version automatically determines version increments based on commit messages (e.g., incrementing the patch version for "fix:" prefixes, the minor version for "feat:" prefixes, etc.) and generates or updates the CHANGELOG.md file.

bash
 npx standard-version

This command automatically updates the version number, generates the change log, and creates a new Git tag.

Summary

By using these methods, application version control can be effectively implemented in Create React App projects, ensuring code traceability and maintainability, as well as facilitating team collaboration and version tracking.