• Public
  • Public/Protected
  • All

⚙️ Configuring the UBC Launch Pad Website

⚠️ This page is meant to be read from the Site Configuration Guide website!

Most frequently updated website values (recruitment status, featured projects, etc.) on the UBC Launch Pad website can be updated by changing the values in src/config.ts, a configuration file written in TypeScript. This site describes the different configuration options available and guidance on what each value should be.

To make a change, simply edit the values in src/config.ts based on the guidance in the type documentation on this website and open a pull request in ubclaunchpad/ubclaunchpad.com. Your changes will be automatically deployed when your pull request is accepted and merged!

If something you want to change that cannot be configured with config.ts, refer to the contribution guide for more detailed documentation on making changes to the website.


Configuring Recruitment Status

One example of an easily configurable component of the website is recruitment and applications information. To open applications for a new season, simply update recruitmentConfig with the appropriate values, for example:

- season: 'Fall 2019'
+ season: 'Spring 2020'
- applicationsOpen: false
+ applicationsOpen: true

More details are available in the recruitmentConfig documentation. Make sure the relevant rolePageURL pages are up to date as well!

Adding a Custom Redirect

When preparing an event, you might want to be able to share https://ubclaunchpad.com/my-amazing-event as a nicer URL for people to access, which could then redirect them to another website. To add such a redirect, just add a new Redirect to redirectsConfig:

  path: '/my-amazing-event',
  target: 'https://my-amazing-event-website.com',

We use these redirects instead of using a third-party link shortener to create short links.

Also refer to USING.md for more details. You can also check redirects.txt for a full list of currently active redirects.

Updating Projects on the Website

Projects featured on the website are configured in clubConfig under clubConfig.currentProjects and clubConfig.featuredProjects, which currently provides the projects in the "Teams" and "Past Projects" sections of the website respectively.

To make a change, simply add/remove/update one of the entries in clubConfig.currentProjects or clubConfig.featuredProjects - see the Project type for more details.

Providing Images

Many of the configuration options pertain to providing image assets through a URL (for the most part, avoid committing images to this repository to help prevent it from growing needlessly). When providing such an URL, make sure the provided link is a direct link to the image, i.e. instead of:


the link should look something like:


On most browsers, you can get this link by right-clicking the image and selecting "Copy Image Location".

Be wary of the image size! Large images load slowly and can directly impact the experience of using the website - try an online image compressor, such as compresspng, to keep file sizes to <100kB.

Note that in some cases, if you use the gif or similar format, provided images can be animated, which looks pretty cool in the right situations!

Verifying Changes

When you open a pull request, Netlify will automatically deploy a preview website for us, where we can verify the output of a configuration change.

To check how changes look locally, refer to the contribution guide.

This documentation site is generated using npm run docs from type definitions and inline documentation.



Const redirectsConfig

redirectsConfig: Redirect[] = [{path: '/events',target: `${clubConfig.socials.facebook}/events`,},{path: '/slack',target: 'https://ubclaunchpad.slack.com',},{// newsletter redirect to #resources, which is nicer-looking than the buttondown pagepath: '/newsletter',target: '/#resources',},{// redirect to latest campaign's Medium blog post - learn more about campaigns in our handbook:// https://docs.ubclaunchpad.com/handbook/tools/social-media#social-media-campaignspath: '/latest',target: `${clubConfig.socials.medium}/state-of-launch-pad-2020-2da3f4cfbc36`,},]

Declare additional redirects to generate on each build. Make sure it does not conflict with any existing redirects - a complete list is available in redirects.txt.

See Redirect for options.

Const clubConfig

clubConfig: object

Club configuration (projects, members, etc.)


currentProjects: ({ description: string; elevatorPitch: string; name: string; banner: object; links: object; media: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object; media: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object; media: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object })[] = [{name: 'Sync',description: '📺 Watch YouTube videos in sync with friends',elevatorPitch: `Sync is a synchronous YouTube streaming app for you to watch, share, and talkabout videos with your friends. Create stream rooms with your friends. Chat and video callyour friends and create endless playlists to watch videos together.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/sync/master/.static/banner.png',hasName: true,},media: {type: 'youtube',id: 'Y143tZxDp2A',},links: {repository: 'https://github.com/ubclaunchpad/sync',website: 'https://sync.ubclaunchpad.com/',},},{name: 'Physio Space',description: 'The physio that’s always at your side',elevatorPitch: `Physio Space collects real-time 3D position data of the patient's body whiledoing exercises for the therapist to adjust exercises using a machine learning model directlyimplemented into the browser, which is first analyzed within the app, and then providedto a physiotherapist who can further analyze the data.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/physiospace-react/master/showcasethumbnail_PhysioSpace.png',hasName: true,},media: {type: 'youtube',id: 'gNtLn0EDFeQ',},links: {repository: 'https://github.com/ubclaunchpad/physiospace-react',website:'https://thephysio.space/',writeup:'https://github.com/ubclaunchpad/physiospace-react/blob/master/README.md',},},{name: 'Footprint',description: '🍃 Learn how the food you eat impacts your carbon footprint ',elevatorPitch: `Footprint is a React Native application that enables users to scan food itemsusing computer vision and obtain the corresponding ecological footprint of the product.We hope that Footprint will empower individuals to make environmentally informed decisionsabout the food they consume.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/Footprint/master/project_images/final_design.png',hasName: true,},media: {type: 'youtube',id: 'iA3D2AmhkZE',},links: {repository: 'https://github.com/ubclaunchpad/Footprint',writeup: 'https://github.com/ubclaunchpad/Footprint/blob/master/README.md',},},{name: 'UBC Simulator 2',description: '💭 A \'choose your own adventure\' game set in UBC',elevatorPitch: `UBC Simulator 2 is a 'choose your own adventure' style browser game wherethe player attempts to survive a year as a student at UBC, featuring time sensitive events,minigames, and campaign personalization!`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/ubcsim2/master/.static/thumbnail.png',hasName: true,},media: {type: 'youtube',id: 'xWBKmqTYMYc',},links: {repository: 'https://github.com/ubclaunchpad/ubcsim2',website: 'https://ubcsim2.ubclaunchpad.com',},},{name: 'keepfresh',description: 'Dabbing out food waste and over-spending on groceries',elevatorPitch: `keepfresh is an iOS app that will allow users to track the food in theirhomes, see when items are expiring, and find recipes based on their inventory.`,banner: {// TODO: update when https://github.com/ubclaunchpad/food-doods/tree/showcase is mergedurl: 'https://raw.githubusercontent.com/ubclaunchpad/food-doods/showcase/photos/keepfresh-thumbnail.png',hasName: true,},media: {type: 'youtube',id: 'TWh32lj3Yjs',},links: {repository: 'https://github.com/ubclaunchpad/food-doods',// TODO: update when https://github.com/ubclaunchpad/food-doods/tree/showcase is mergedwriteup: 'https://github.com/ubclaunchpad/food-doods/blob/showcase/README.md',},},{name: 'Access Youth',description: '💪 Supporting troubled youth outreach and empowerment',elevatorPitch: `Access Youth is a non-profit organization designed to help at-risk youthacross the Greater Vancouver area by providing them with counseling services. The organizationhas a bus program which serves as a mobile counseling service for at-risk youth. Our mobileapp targets the users of the bus program.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/accessyouth-api/fb271fc2fad9a89a637f58769408ea4efea0faf0/Thumbnail.png',hasName: true,},links: {repository: 'https://github.com/ubclaunchpad/accessyouth-api',writeup: 'https://github.com/ubclaunchpad/accessyouth-api#access-youth-mobile---our-experience-building-this',},},]

The current or most recent active Launch Pad projects.

Each element must satisfy Project.


featuredProjects: ({ description: string; elevatorPitch: string; name: string; banner: object; links: object; media: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object } | { description: string; elevatorPitch: string; name: string; banner: object; links: object })[] = [{name: 'Inertia',description: '✈️ Effortless, self-hosted continuous deployment',elevatorPitch: `Inertia is an app that enables effortless setup and management of automated,continuous deployment on any virtual private server. It is used by several Launch Pad projectsand features a serverside service, a command-line interface, and the ability to deployalmost anything anywhere.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/inertia/master/.static/banner.png',hasName: true,},media: {type: 'youtube',id: 'amBYMEKGzTs',startAt: 17945,},links: {repository: 'https://github.com/ubclaunchpad/inertia',website: 'https://inertia.ubclaunchpad.com',writeup: 'https://medium.com/ubc-launch-pad-software-engineering-blog/building-continuous-deployment-87a2bd8eedbe',},},{name: 'Rocket 2',description: '🚀 Slack bot for UBC Launch Pad',elevatorPitch: `Rocket 2 is a from-the-ground-up rebuild of our previous in-house managementSlack bot. Rocket 2 handles team management, GitHub permissions, member onboarding, andmore through a robust set of commands accessible from Slack.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/rocket2/master/docs/rocket-banner.gif',},links: {repository: 'https://github.com/ubclaunchpad/rocket2',website: 'https://rocket2.readthedocs.io',},},{name: 'Bumper',description: '🥊 Fast-paced multiplayer arcade game',elevatorPitch: `Bumper is a game fast-paced multiplayer game where you try to bump otherplayers out of the playing field to stay alive.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/bumper/master/.static/bumper-small.gif',},links: {repository: 'https://github.com/ubclaunchpad/bumper',},},{name: 'ubclaunchpad.com',description: '✨ the new UBC Launch Pad website!',elevatorPitch: `This website is also a Launch Pad project, designed and implemented from theground up by members of our team!`,banner: {url: require('../.static/banner.png') as string,hasName: true, // this one should be self-explanatory},links: {repository: 'https://github.com/ubclaunchpad/ubclaunchpad.com',writeup: 'https://medium.com/ubc-launch-pad-software-engineering-blog/introducing-the-new-launch-pad-website-42175181d644',},},{name: 'Cumulus',description: '💸 Cryptocurrency that doesn\'t waste your time',elevatorPitch: `Cumulus is a cryptocurrency that allows users to send and receive tokens ona P2P network or "mine" on the network to create tokens for themselves. Cumulus reimaginesthe proof-of-work mechanism used by Bitcoin and many other major cryptocurrencies to putcoin mining computation time to good use.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/cumulus/dev/.static/banner.png',hasName: true,},links: {repository: 'https://github.com/ubclaunchpad/cumulus',writeup: 'https://medium.com/ubc-launch-pad-software-engineering-blog/introducing-cumulus-940456b7e05c',},},{name: 'Minutes',description: '🔭 Speaker diarization via transfer learning',elevatorPitch: `Minutes is a Python library for speaker diarization: the process of splittingup an audio file into its unique speakers. Its base model is trained on hundreds of hoursof spoken English text, and it uses transfer learning to predict on new speakers.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/minutes/master/.static/spec.png',},links: {repository: 'https://github.com/ubclaunchpad/minutes',writeup: 'https://medium.com/ubc-launch-pad-software-engineering-blog/speaker-diarisation-using-transfer-learning-47ca1a1226f4',},},{name: 'etch.space',description: '📝 A live multi-user collaborative etch-a-sketch',elevatorPitch: `Etch is a live multi-user collaborative etch-a-sketch built on websockets.Each user is assigned their own color and can draw whatever their imagination allows whilewatching others draw at the same time.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/etch.space/master/banner.png',hasName: true,},links: {repository: 'https://github.com/ubclaunchpad/etch.space',},},{name: 'Eat',description: 'Should we eat 🌮, 🍟, or 🍣?',elevatorPitch: `Eat helps you decide on a restaurant that accommodates everyone's preferencesby suggesting places to eat based the group's location, dietary restrictions, price range,and intended meal time. After everyone has voted on the suggested restaurants the appselects the best one for the group.`,banner: {url: 'https://raw.githubusercontent.com/ubclaunchpad/eat/master/Images/animated-banner.gif',hasName: true,},links: {repository: 'https://github.com/ubclaunchpad/eat',app: {url: 'https://apps.apple.com/ca/app/eat-now-find-where-to-eat/id1366648100',type: 'ios',},},},]

Feature past Launch Pad projects.

Each element must satisfy Project.


memberCount: number = 50

The current club member membership count.


socials: object

Links to Launch Pad online!


buttondown: string = "https://buttondown.email/ubclaunchpad"


email: string = "team@ubclaunchpad.com"


facebook: string = "https://www.facebook.com/ubclaunchpad"


github: string = "https://github.com/ubclaunchpad"


instagram: string = "https://www.instagram.com/ubclaunchpad"


linkedin: string = "https://www.linkedin.com/company/10054664"


medium: string = "https://medium.com/ubc-launch-pad-software-engineering-blog"


youtube: string = "https://www.youtube.com/channel/UCS0ghlwqTOc1RH_nYENNT5A"

Const recruitmentConfig

recruitmentConfig: object

Recruitment configuration.


applicationsOpen: true = true

Toggle whether applications are open or not - this activates CTAs on the website for signup, such as a 'Join Us' button and the 'Join Us' section.


positions: { name: string; rolePageURL: string }[] = [{name: 'Developer',rolePageURL: 'https://docs.ubclaunchpad.com/handbook/recruitment/developer',},{name: 'Designer',rolePageURL: 'https://docs.ubclaunchpad.com/handbook/recruitment/designer',},]

Define positions we are recruiting for. Each position will get a redirect generated under https://ubclaunchpad.com/join/$POSITION_NAME

Each element must satisfy ClubPosition.


season: string = "Winter 2023"

Recruitment season name.

Const sponsorshipConfig

sponsorshipConfig: object

Sponsorship configuration.


packageURL: string = "https://drive.google.com/file/d/139k5jirMNCkOGth6MXH8JsDJcurhseV5/view"

Link to the most recent sponsorship package.

We will generate a redirect for this link under https://ubclaunchpad.com/sponsorship


sponsors: ({ name: string; tier: "gold"; website: string; logo: object } | { name: string; website: string; logo: object } | { name: string; website: string; logo: object })[] = [{name: 'Axiom Zen',website: 'https://www.axiomzen.co/',tier: 'gold',logo: {url: 'https://res.cloudinary.com/dfgx570fg/image/upload/w_700,h_700,c_limit/v1468362472/f2ed2lbpqujvxa8r6zux.png',filter: 'invert()',},},{name: 'East Side Game Studio',website: 'https://www.eastsidegames.com/',tier: 'gold',logo: {url: 'https://www.eastsidegames.com/wp-content/themes/esgnew/img/logo-final.png',filter: 'invert() grayscale(0.5)',},},{name: 'GitHub',website: 'https://github.com',logo: {url: 'https://github.githubassets.com/images/modules/logos_page/GitHub-Logo.png',filter: 'invert()',},},{name: 'Netlify',website: 'https://netlify.com',logo: {url: 'https://www.netlify.com/img/press/logos/full-logo-dark.png',},},{name: 'Fathom Analytics',website: 'https://usefathom.com',logo: {url: require('./assets/logos/fathom-light.svg'),},},]

Current sponsors.

Each element must satisfy ClubSponsor.



ClubPosition: { name: string; rolePageURL: string }

Describes a Launch Pad position (e.g. 'Developer', 'Designer')

Type declaration

  • name: string

    Position name.

  • rolePageURL: string

    Link to learn more and apply to this position.


ClubSocials: { buttondown: string; email: string; facebook: string; github: string; instagram: string; linkedin: string; medium: string; youtube: string }

Describes set of links to Launch Pad online.

We will generate redirects for most links here, for example https://ubclaunchpad.com/facebook

Type declaration

  • buttondown: string

    Buttondown is a newsletter provider - see https://buttondown.email

  • email: string
  • facebook: string
  • github: string
  • instagram: string
  • linkedin: string
  • medium: string
  • youtube: string


ClubSponsor: { logo: { filter?: undefined | string; url: string }; name: string; tier?: "bronze" | "silver" | "gold" | "platinum"; website: string }

Describes a club sponsor.

Type declaration

  • logo: { filter?: undefined | string; url: string }

    Sponsor logo - the url must be PNG, with transparent backgrounds, and roughly 140px by 120px (or a 3:2 aspect ratio).

    Try to source logos from online. If the company does not have a linkable logo suitable for the sponsors section, add the logo to /src/assets/logos.

    To make simple adjustments to help the logo look better against the website's background, use logoFilter to apply some simple CSS effects.

  • name: string

    Sponsor name.

  • Optional tier?: "bronze" | "silver" | "gold" | "platinum"

    How much support this sponsor provided. Refer to the sponsorship package for more details.

  • website: string

    Link to sponsor website.


MediaImage: { type: "image"; url: string }

Describes an image.

Type declaration

  • type: "image"
  • url: string


MediaYouTube: { id: string; startAt?: undefined | number; type: "youtube" }

Describes a video. Currently, we only support YouTube embeds.

Type declaration

  • id: string

    The video ID, usually found at the end of the link. For example, the following link:


    has video ID gNtLn0EDFeQ.

  • Optional startAt?: undefined | number

    Number of seconds into the video to start at by default.

  • type: "youtube"


Project: { banner: { hasName?: undefined | false | true; url: string }; description: string; elevatorPitch: string; links: { app?: undefined | { type: "ios" | "android"; url: string }; repository: string; website?: undefined | string; writeup?: undefined | string }; media?: MediaYouTube | MediaImage; name: string }

Describes a Launch Pad project.

Type declaration

  • banner: { hasName?: undefined | false | true; url: string }

    Small 640px by 320px banner image (or equivalent 2:1 image of reasonable resolution, i.e. less than 1mb) for featuring your project.

    Bonus: note that this image format is also used by GitHub to provide link previews when you share your repository - just go to your repository's Settings and upload the same image under the "Social preview" option.

    • Optional hasName?: undefined | false | true

      Indicate if the banner has project name, and that a name should not be generated on the website.

    • url: string
  • description: string

    Super short one-line description about this project, around 5-10 words.

  • elevatorPitch: string

    Two or three sentences diving into your project - what does it do? How does it do it?

  • links: { app?: undefined | { type: "ios" | "android"; url: string }; repository: string; website?: undefined | string; writeup?: undefined | string }

    Links to further information about this project.

    • Optional app?: undefined | { type: "ios" | "android"; url: string }

      If the project is an app, link to the app and type of app.

    • repository: string

      Link to GitHub repository

    • Optional website?: undefined | string

      Link to deployed website

    • Optional writeup?: undefined | string

      Link to a blog post or similar writeup

  • Optional media?: MediaYouTube | MediaImage

    Detailed or more descriptive media to showcase your project - featured in project modals.

    This can be one of:

  • name: string

    Human-readable name for project.


Redirect: { path: string; target: string }

Defines a redirect - see redirectsConfig.

Type declaration

  • path: string

    Path to redirect, such as /my/amazing-link. This will translate to ubclaunchpad.com/my/amazing-link.

  • target: string

    URL or path to redirect to, such as https://my-event-page.com.


Generated using TypeDoc