Local Development

The DDD Sydney website is a fork of the DDD Perth website. Occasionally we will merge with the DDD Perth master branch, but that is a really time consuming process so you'll want a really good reason to do so. You're better off just cherry-picking in the changes you want from there and applying them manually.

Prerequisites

• Node.js
  • We build using node@10 so you can use that, or probably any version really
• An editor
  • VS Code works well, and there's debugging stuff configured for VS Code in the repo
    • VS Code will prompt about some recommended extensions if you want them
• A browser
  • If you're using Chrome or Edge (Edge Chromium) you'll want to install the React dev tools

Getting Started

• Clone the repo (using whatever tool you wish to use to work with Git)
• Run npm install to install the required Node.js modules
• Run npm run dev to run the dev server
• Navigate to http://localhost:3000/ 🎉

About the code

The website is based on Next.js and ultimately is deployed as a Single Page App (SPA), but for local development it's running a node.js server (this enables hot reloading and stuff like that).

The code base is React + TypeScript, meaning that you will probably want to know a bit of React to do it, and if you know JavaScript then the TypeScript side won't cause too many issues, more it'll warn you if you have anything incorrect (and it'll prevent the build from running). Mostly, the TypeScript errors will come down to missing properties or incorrect use of types.

Stuff you'll likely edit

• config/conference.js
  • This is the metadata file about the conference and a whole heap of the settings
  • Stuff in here filters down all over the site, but it's mostly done indirectly (through a whole bunch of wrapped React types, and that's a pain to debug!)
• config/sponsors.ts
  • This is the list of who is sponsoring us
  • Don't worry about the order inside the TypeScript object, it'll be tweaked when it's displayed

Stuff to know about

There's a lot more files but you won't often have to edit them, unless you're doing an overhaul of something major.

• /components
  • This is where the shared UI pieces live
  • currentAgenda.tsx contains the current years agenda, or more accurately, the ID's to the agenda items to render it out in the right place from the API
• /pages
  • The pages of the website which is fed by the config files and API
  • The previous agendas (/agenda/*) are clones of currentAgenda.tsx
• next.config.js
  • If you want to add a new page to the site you'll need to make sure it's listed here or it won't get exported to the static site and thus won't be released

The API

There's an API That backs DDD Sydney (https://api.dddsydney.com.au) and if you want to use the API in local dev either start the API locally or change the URLs in the package.json under the scripts -> dev script to not use localhost.