Skip to content

Getting Started

Jump to bottom
Oculux edited this page Aug 3, 2024 · 15 revisions

You will need node version 18.17.0 and git (any version).

First-Time Setup

  1. git clone https://github.com/UoaWDCC/younite-web.git
  2. Open the folder created younite-web in VSCode (open the folder itself - don't have it as a subfolder)
  3. Make sure your node version is 18.17.0
  4. npm run setup (if that doesn't work, run npm install in all three folders - see the root package.json)
  5. Copy the provided .env files (resources channel on Discord) into the next and strapi folders respectively. If you're doing this after running the applications, you'll need to restart them for the changes to take effect.

Running The Application Locally

  1. cd strapi and npm run dev
  2. In a new terminal, cd next and npm run dev
    Steps 6 & 7 start up the Next.JS app and Strapi CMS - you can access them through the links printed in the console.

Potential errors:

  • 'next'/'strapi' is not recognized as an internal or external command: cd into the relevant folder, check node -v is 18.17.0 then run npm install
  • Next app crashes with invalid URL/token/etc - check your .env files exist, are saved, and are in the right place
  • Something about better-sqlite3 and NODE_VERSION 115: check node -v is 18.17.0 then run npm rebuild better-sqlite3 in the strapi folder
  • Oops my node version wasn't 18.17.0 exactly: delete all the node_module folders and rerun npm run setup / npm installx3
  • Windows - I get an ExecutionPolicy error: run Set-ExecutionPolicy RemoteSigned in the terminal
  • The terminal mentions vulnerabilities or auditing: that's okay! Feel free to ignore that 🙃
  • Strapi throws a bunch of ERESOLVE warnings: that's okay! Feel free to ignore that 🙃
  • When I run npm run dev the command never terminates: yep that's what you want - you want both Next and Strapi to run forever until you terminate them with ctrl + C
  • The Next app throws a 401 authentication error: good job that's means you're ready for the next bit - head to the next section

Setting Up Strapi

You'll need to populate the Strapi CMS (database) in order for the Next app to load. Sorry, this step's a little tedious.

  1. Log in to the admin dashboard (credentials in the strapi .env file)
  1. Head to Settings > API Tokens and generate a new unlimited, full-access token.
  1. After saving, make sure to copy the generated token (treat it as a password) and paste it into the next/.env file in your repository. You can only view this once but you can regenerate a token if you lose it.


  1. Head to the content manager tab and fill everything out. It can be gibberish - the data is stored locally on your machine and everyone has a different copy of the data for testing. I recommend starting with the header and home-page types so your home page loads.

Exception: the header tab needs these specific URLs to link properly. Names don't matter.

  • /about
  • /projects
  • /members
  • /feedback
  • /
  1. Save AND publish each page.

Potential errors:

  • Fetch failed: Strapi isn't running correctly - is the terminal running and can you access the admin dashboard?
  • 401: You're not authenticating. Head to step 9.
  • 403: You're unauthorized. You've provided an API key but for some reason that's not authorized to access data. Check you gave full permissions and copied the token properly?
  • 404: You're authenticated and authorized, but you just can't find the content. Check your URL is right, and that you've successfully saved AND PUBLISHED both the header and the specific data for the page you're viewing.
  • 505: Internal server error. Uh, Strapi messed up somewhere - try restart everything and message one of us if you can't figure out a workaround yourself :)

It might pay to chuck a few console.logs in next\util\strapi.ts - that's where the fetching happens.

Result

This is what the home page of the Next app looks like after populating Strapi.

You're ready to work on a ticket! See Workflow

Clone this wiki locally