0
118
ViewsHow to show the app version and last updated datetime in a React or Next app?
I build my React/Next app using Github Actions. In the workflow, I have set up an automated system to determine the next release version. It creates a .version file containing the version and a .last-updated file containing the build date and time.
Now how do I use these files in my app and show the required information or is there a better way to do such a thing?
I want something like Notion:
·
Juan Pablo Isaza
1 answers
Answer question0
Okay. So I figured it out.
- In
next.config.js, add the following config:
const fs = require("fs");
const version = fs.readFileSync("./.version", "utf8");
const lastUpdatedAt = fs.readFileSync("./.last-updated", "utf8");
module.exports = {
...
env: {
NEXT_PUBLIC_PACKAGE_VERSION: version,
NEXT_PUBLIC_LAST_UPDATED_AT: lastUpdatedAt,
},
};
Note: For public environment variables, prefix them with
NEXT_PUBLIC_.
- Then in your JSX templates, use like this
<p>Version: {process.env.NEXT_PUBLIC_PACKAGE_VERSION || "-"}</p>
<p>Last Updated At: {process.env.NEXT_PUBLIC_LAST_UPDATED_AT || "-"}</p>
·
Juan Pablo Isaza
Report
Answer question