Summary

Welcome to Frontend Workshop 2022, hosted by CSSC x GDSC! At this workshop, we hope to show you how to develop basic front-end interfaces with React. In this document, you can find:

• Setup instruction: How to setup and run your starter code (this repo!), and install the required technologies
• Resources: slides we used in this workshop, and online documentation/tutorials that we find helpful to learn front-end development
• Credits: resources we take inspiration from/re-use for the purpose of this workshop, and the author contact for this workshop's materials!

The code in this repo is a resume website template we found online and modified for the purpose of this workshop. We will work on it during the workshop!

Setup Instructions

Install requirements

For this workshop, we use React + Git as fundamental, and other packages as dependencies (you can install them once you setup the starter code). With that being said, you may want to install some software first on your machine:

• Node.js (≥ 14.0.0) & Npm (≥ 5.6): Check nodejs.org for download information. Npm (Node package manager) is usually installed as a bundle with Node.js (so if you installed Node.js, you should also have npm)
• Git (latest version recommended): Check https://git-scm.com/downloads for download information. You may find our Git Workshop (https://youtu.be/K1V_xtcGCl4) helpful in this workshop

Clone starter code

Now it is time to get the starter code on your computer and run it! Go to your terminal/git bash and clone this repo:

git clone https://github.com/utm-cssc/frontend-workshop-2022

Note that you are not required to fork this repo, but you are able to if you want!

Once you clone this repo to your machine, now we want to run the code by changing directory (cd), install dependencies, and then run our React

cd frontend-workshop-2022
npm install
npm start

Now you should see a website running on https://localhost:3000

Resources

• Workshop slides
• Workshop recording
• React official documentation: reactjs.org
• React resources by CSSC
• React resources by GDSC

Credits

• Authors: Giang Bui (CSSC, GDSC) & Brian Zhang (CSSC)
• Credits to slide inspiration: Presentation from White Van
• Credits to starter code inspiration: shankarshastri responsive-resume-template