Welcome to The Legacy Project's JumboCode team! This is our repository where we will keep our code and track changes.
This section will walk you through the steps to set up your laptop for development. Please reach out to us if you're stucked or confused at any point!
Open the command line interface for your Operating System. On Windows, we recommend using Windows Linux Subsystem; on Macs, you can proceed with Terminal.
We will use Git for version control. After you have opened the terminal, verify that Git is installed on your machine
# Terminal
# "which" command locates an executable called "git"
which gitIf which git raises an error, then you will need to install Git.
We will use Git to interact with GitHub, a code hosting platform. We will now set up your terminal to work with GitHub.
- Create a GitHub account if you do not have one.
- On terminal, set up your identity.
# Terminal
git config --global user.name <Your GitHub username>
git config --global user.email <Your GitHub email>- Create a SSH key to interact with GitHub, following this guide. Once you have created your SSH key, go ahead and add it to your GitHub account, as instructed here.
We will need to install Node.js to run JavaScript for development - you can check whether Node.js is installed by typing which node on the terminal.
We will use Visual Studio Code to write code. After you have opened Visual Studio Code, we will install some productivity extensions:
- ESLint - A static analysis tool for JavaScript applications,
- Prettier - A tool to automatically format code,
- Prisma - Syntax highlighting for Prisma schemas,
- Tailwind IntelliSense - A tool to improve development with TailWind.
In your terminal, navigate to the folder where you want Git to put your TheLegacyProject2 folder containing the source code. To pull the code, run the following command:
# Terminal
git clone [email protected]:JumboCode/TheLegacyProject2.gitIf the command did not error out, you can now navigate to a folder named TheLegacyProject2.
We will need credentials to connect with external services, such as MongoDB. It is bad security practice to commit these credentials to the codebase. Create a .env directly under the root directory; this file does not already exist, but there is a .env-example for you to copy over. Finally, talk to us to get the credentials.
On terminal, type:
npm installto install all the necessary packages to run the application,npm devto start development server.
If the commands did not error out, then congrats! You've successfully started the server and are ready to make some changes 😁. You can visit http://localhost:3000/ to view the website.
This section outlines some guidelines and expectations for development.
We prefer small and iterative changes, as they will be easier to review. To start developing a new feature, the general development process is as follow:
git checkout maingit checkout -b <Your GitHub username>/<feature>- Make your changes
- Once you're happy with your changes:
- Make sure that
npm run builddoesn't error out, git add <file 1> <file 2> ... <file n>to stage all the files you want to commit for version control,git commit -m "<A message to describe your changes>",
- Make sure that
- Go to the GitHub repository to make a Pull Request (PR). After you've made a PR, request for review from someone else.
Git can be especially confusing if this is your first time using it. We recommend that you read through the first 3 chapters of Git Book.
You may have noticed that we have 2 different folders with frontend code: src/pages/ and src/app/. The first folder contain code that was developed by the Jumbo Code group last year, which uses Next.js 12. We will mostly work with src/app folder, which uses Next.js 13. Therefore, when you're searching online for documentations, be sure to look at the correct Next.js version for your use case.