Greetings, readers and fellow developers! I recently had the opportunity to undertake a significant task: consolidating multiple projects from distinct repositories into a unified mono-repo for an open-source initiative named ClassroomIO. This article outlines the steps I followed and the hurdles encountered throughout the migration. To begin, let's briefly delve into ClassroomIO.
ClassroomIO is an innovative platform tailored for bootcamps, individual educators, and training enterprises, designed to integrate teaching and learning while boosting productivity tenfold. The platform enables the seamless management of numerous classes and cohorts through a single, user-friendly interface. Emphasizing a mobile-first approach, ClassroomIO ensures that students can access educational materials from any device, anywhere.
Initially, ClassroomIO was spread across three separate project repositories:
- ClassroomIO.com: The primary landing page, crafted using SvelteKit and TailwindCSS.
- ClassroomIO Documentation: A dedicated documentation portal developed with Nextra, a Next.js MDX-based framework.
- ClassroomIO Dashboard: The core project, built with a combination of SvelteKit, TailwindCSS, and Supabase.
Before I got assigned the task, all projects had contributors and commit attached to them, so keeping the commit history was important.
Creating the workspace
First, I had to set up a workspace inside classroomio repository using pnpm. The folder structure follows TurboRepo's walkthrough, so I did the following:
- Created `apps` and `packages` workspaces for each project and shared config, respectively.
- I deleted the node_module folder
- and moved the SvelteKit project to apps/classroomio (also created 2 empty folders for other projects)
- added shareable TsConfig, ESLint configs, and svelte component library (probably won’t be used) to the `/packages` workspace
- set up general code lint and formatting configs for all projects
- set up turbo.json config
This approach kept the commit history in this repository intact.
Adding other projects to the mono-repo project was as easy as copying everything (except for the node_module folder and package-lock.json) into their respective folders.
đź’ˇI had to edit the `name` field in each project's package.json to avoid conflicts when adding new NPM packages to specific projects
Next, I went through the `package.json` files inside each project, and modified their `devDependencies` and `dependencies` fields to include packages from the workspaces, and their script commands before I installed all packages using `pnpm install`.
Fixing build errors
Building all 3 projects and testing them in dev mode came with a few issues.
- First was the .svelte-kit configs in the SvelteJs projects. I initially had those inside the `packages/` workspace as a shared config and extended the configs. The fix was to leave these configs in their respective projects.
- Debugging the issue with `dayjs` package wasn’t straightforward. I tried re-running `pnpm install` from the workspace’s root. The second step I tried that worked was
- deleting all node_modules and auto-generated folders from the project (I added a clean script cmd in all `package.json` files)
- removed the `dayjs` package name manually from the `package.json` file
- re-installed the packages using pnpm install
- installed dayjs to `classroomio` project using pnpm add dayjs —filter classroomio
- The classroomio and docs project required env variables before it could complete the build process. Instead of setting up a general .env file, adding the .env file to classroomio worked just fine.
Conclusion
In conclusion, my journey to transform multiple repositories into a single monorepo for ClassroomIO has been a challenging yet rewarding experience. Through this process, we've successfully merged three distinct projects into one cohesive repository, preserving the valuable commit history. This endeavor not only streamlined our development process but also enhanced the overall efficiency and collaboration within our team.
As we continue to develop and refine ClassroomIO, I invite you to join us in this exciting journey. Your support and contributions are invaluable to the growth and success of this open-source project. If you find ClassroomIO intriguing or useful, please consider starring the project on GitHub to show your support. Additionally, for real-time discussions, insights, and a chance to collaborate with a community of like-minded individuals, join our Discord channel. Your feedback, suggestions, and contributions will help shape the future of ClassroomIO, making it an even more powerful tool for educators and learners alike. Together, let's revolutionize the world of online education!