CI/CD integration

Creating a cleaner, safer and robust Rerum Playground codebase

Comment

Inspiration

Rerum Playground is an open-source web annotation tool which uses the RERUM installation of the Research Computing Group at Saint Louis University to explore the possibilities of tools and standards. I came across this project in my Capstone Project 1 class where I worked as an internal CI/CD developer within our team. Since our team has to choose 2 projects every sprint, I chose Rerum for one of my sprints and this was a great decision since Rerum was one of the projects I had to contribute to for this maintain-a-thon. I wanted to strengthen Rerum's CI/CD configuration to ensure that students, faculty and external developers could work confidently without breaking production code.

What it does

My enhancements include automated code-quality checks, standardized formatting, dependency monitoring and clear documentation. With these improvements:

  • ESLint and Prettier keep JavaScript code clean and consistent.
  • The GitHub Actions workflow automatically runs linting on every push and pull request.
  • Dependabot scans for outdated or vulnerable dependencies once every week.
  • A stronger and comprehensive .gitignore file prevents large, accidental commits involving many unnecessary files.
  • Documentation files such as SECURITY.md, CHANGELOG.md, and CI overview guide future contributors and helps understand the CI/CD implementation.

How we built it

First I began by integrating ESLint and Prettier to ensure that all JavaScript files followed consistent style rules. I created an eslint.config.js file, along with .prettierrc.json and .prettierignore for consistent formatting. Next, I configured a GitHub Actions workflow through a lint.yml file to automatically run lint checks through every push and pull request.

To contribute to security measures and ensure long-term maintenance, I added Dependabot through a dependabot.yml file in the .github folder which enables weekly checks for outdated npm dependencies and GitHub Actions versions. The project repository was improved with a more comprehensive .gitignore file, and I also included professional README badges to display lint workflow status, Dependabot activity, code style and license. This ultimately improves project clarity and cl

Challenges we ran into

Some technical challenges that I encountered were as follows:

  • Migrating to ESLint's new flat configuration format required a careful analysis and setup.
  • The CI initially failed due to missing globals, incorrect configurations and conflicting workflows.
  • Including CodeQL scanning caused duplication errors since the project was already integrated with GitHub's CodeQL, which required further investigation and correction.
  • Fixing hundreds of lint warnings across the project repository needed a careful investigation while preserving functionality.
  • Ensuring that none of the changes implemented in CI/CD broke production code needed structured iteration and patience.

Accomplishments that we're proud of

During the maintain-a-thon, I was able to accomplish several milestones with regards to a robust, structured CI/CD configuration which included the following -

  • Successfully integrated a complete ESLint + Prettier pipeline.
  • Implemented an automated GitHub Actions linting workflow with green checks.
  • Enabled Dependabot for continuous security through weekly scans and dependency updates.
  • Improved repository hygiene through an enhanced and comprehensive .gitignore file, preventing large and unnecessary files from being committed.
  • Modernized project README with clear and professional badges.
  • Wrote high-quality documentation, including SECURITY.md, CHANGELOG.md and a CI overview document.

What we learned

Throughout this maintain-a-thon, I was able to gain hands-on experience working with modern CI/CD tooling and GitHub workflow automation. By integrating ESLint and Prettier, I understood how important it was to ensure that code formatting remained consistent throughout the repository. It also remains crucial to do regular security scans and dependency management as old dependencies are always vulnerable to security issues. Through effective troubleshooting, clear documentation and communication, I was able to acquire real-world experience in software engineering.

What's next for CI/CD integration

Some next steps for CI/CD improvements could include the following:

  • Adding Husky + lint-staged to enforce linting on every commit.
  • Introducing a lightweight Jest test suite with a test workflow.
  • Exploring automated HTML/JSON validation as part of the CI pipeline.

- Including relevant documentation such as architecture or developer onboarding guides.

Built With

Share this project:

Updates