add update readme script (#191)

* add update readme script

* tweak generated text

* add instruction in docs

* tweak docs

CONTRIBUTING.md

@@ -144,48 +144,54 @@ This will create a production version of the library in `/dist` directory.
 
 ## Making Releases
 
-1. Create a new pull request on the main branch to update the SemVer number in `package.json`. Increment the version number based on [semantic versioning rules](https://semver.org/).
+1. Create a new branch from the main branch and edit the SemVer number in `package.json`. Increment the version number based on [semantic versioning rules](https://semver.org/).
 
-2. Merge the pull request.
+2. Run the following command to update the version number in `README.md`.
 
-3. Switch to the main branch and make sure the code is up to date by running the following command:
+   ```
+   yarn run update-readme
+   ```
 
-```
-git checkout main
-git pull
-```
+3. Commit the changes. Then, make a pull request from the new branch to main and merge it.
 
-4. Make sure all dependencies have been installed by running the following command:
+4. Switch to the main branch and make sure the code is up to date by running the following command:
 
-```
-yarn
-```
+   ```
+   git checkout main
+   git pull
+   ```
 
-5. Build the project with the following command and wait for the build to complete:
+5. Make sure all dependencies have been installed by running the following command:
 
-```
-yarn run build
-```
+   ```
+   yarn
+   ```
 
-6. Run the following command and log in with an npm account that has write access to the `ml5` package. You may be redirected to a browser window for authentication.
+6. Build the project with the following command and wait for the build to complete:
 
-```
-npm login
-```
+   ```
+   yarn run build
+   ```
 
-7. Publish the package with the following command. You may be redirected to a browser window for authentication.
+7. Run the following command and log in with an npm account that has write access to the `ml5` package. You may be redirected to a browser window for authentication.
 
-```
-npm publish --access public
-```
+   ```
+   npm login
+   ```
 
-8. The package should now be available at. (Replace `<version>` with the new SemVer set in step 1).
+8. Publish the package with the following command. You may be redirected to a browser window for authentication.
 
-```
-   https://unpkg.com/ml5@<version>/dist/ml5.js
-```
+   ```
+   npm publish --access public
+   ```
+
+9. The package should now be available at. (Replace `<version>` with the new SemVer set in step 1).
+
+   ```
+     https://unpkg.com/ml5@<version>/dist/ml5.js
+   ```
 
-9. Update the example code on the p5 web editor. Follow the instructions in the [Update p5 Web Editor Sketches](#update-p5-web-editor-sketches) section.
+10. Update the example code on the p5 web editor. Follow the instructions in the [Update p5 Web Editor Sketches](#update-p5-web-editor-sketches) section.
 
 ## Unit Tests
 

README.md

@@ -20,7 +20,7 @@ Please read our [Code of Conduct](https://github.com/ml5js/Code-of-Conduct), whi
 
 Before getting started with ml5.js, review our [Code of Conduct](https://github.com/ml5js/Code-of-Conduct). There are several ways you can use the ml5.js library:
 
-<p id="latest-version">
+<!-- Anchor for automatic version update script, do not remove this comment -->
 
 - You can use the latest version (1.0.2) by adding it to the head section of your HTML document:
 
@@ -30,7 +30,7 @@ Before getting started with ml5.js, review our [Code of Conduct](https://github.
   <script src="https://unpkg.com/[email protected]/dist/ml5.js"></script>
   ```
 
-</p data-id="latest-version">
+<!-- Anchor for automatic version update script, do not remove this comment -->
 
 - If you need to use an earlier version for any reason, you can change the version number. The [previous versions of ml5.js can be found here](https://www.npmjs.com/package/ml5?activeTab=versions). You can use those previous versions by replacing `<version>` with the ml5 version of interest:
 

package.json

@@ -11,7 +11,8 @@
     "postinstall": "patch-package",
     "test": "jest --config tests/jest.config.js",
     "upload-examples": "node scripts/uploadExamples.js",
-    "update-p5-version": "node scripts/updateP5Version.js"
+    "update-p5-version": "node scripts/updateP5Version.js",
+    "update-readme": "node scripts/updateReadme.js"
   },
   "files": [
     "dist"

scripts/updateReadme.js

@@ -0,0 +1,50 @@
+/**
+ * @file This script updates the version number in the README file.
+ * The script reads the version number from the package.json file and updates the README file with the new version number.
+ */
+
+const ml5Version = require("../package.json").version;
+const fs = require("fs");
+
+const readmePath = "README.md";
+
+/**
+ * Generates the section of text with new version number to be inserted into the README.
+ * @param {string} newVersionNumber - The new version number to be inserted into the README.
+ * @returns {string} The new section of text to be inserted into the README.
+ */
+function makeNewVersionString(newVersionNumber) {
+  const newVersionString = `<!-- Anchor for automatic version update script, do not remove this comment -->
+
+- You can use the latest version (${newVersionNumber}) by adding it to the head section of your HTML document:
+
+  **v${newVersionNumber}**
+
+  \`\`\`html
+  <script src="https://unpkg.com/ml5@${newVersionNumber}/dist/ml5.js"></script>
+  \`\`\`
+
+<!-- Anchor for automatic version update script, do not remove this comment -->`;
+
+  return newVersionString;
+}
+
+/**
+ * Updates the README version number to the new version number.
+ * Point of entry for the script.
+ */
+function main() {
+  const newVersionString = makeNewVersionString(ml5Version);
+
+  console.log(`Updating README version number to ${ml5Version}...`);
+
+  const readme = fs.readFileSync(readmePath, "utf8");
+  const newReadme = readme.replace(
+    /<!-- Anchor for automatic version update script, do not remove this comment -->([\s\S]*)<!-- Anchor for automatic version update script, do not remove this comment -->/g,
+    newVersionString
+  );
+
+  fs.writeFileSync(readmePath, newReadme);
+  console.log("🟢 README version number update successful!");
+}
+main();