https://www.youtube.com/watch?v=tuIKgU6fQeg
Pre-phase 1 general stream training - Microsoft Student Accelerator Program 2021
This workshop will cover foundational topics as an introduction into web development. By completing this workshop, we aim that you will be better prepared the for subsequent MSA phases later in the year.
We will be covering the following topics:
- HTML, CSS, and Javascript
- Introduction to Git
- Typescript
- Creating and building upon a React web app
Each of the topics have their own folder in this repo which go into details of the learning outcomes achieved and the content from each of the sessions.
- Laptop & Other Devices
- Laptop Charger and power extension cords
- Snacks, Lunch, Drink Bottle, etc
Please install the software before you attend phase 1 training. Unfortunately, there isn't enough time to go through installation during the workshop. If you do not have the below software installed, you will be left behind.
- Install Visual Studio Code - Code editor.
- Install Git - Version Control system software.
- Register for a GitHub Account - For hosting & storing our project.
- Install NodeJS (for npm)
- Have Microsoft Edge / Google Chrome installed.
Non UoA students should be able to connect via Eduroam. Please familiarise yourself with how to login using your university credentials.
Some helpful links:
- AUT - https://student.aut.ac.nz/study/it-services/using-the-internet-and-wifi#:~:text=How%20does%20eduroam%20work%3F,%40autuni.ac.nz
- MIT - http://icts.manukau.ac.nz/index.php/student-guides/wireless-access/eduroam/
- Unitec - https://www.unitec.ac.nz/askit/unitec-ask-i-m-s/services/eduroam/
- Massey - https://www.massey.ac.nz/massey/staffroom/national-shared-services/information-technology-services/network/wireless-network/eduroam-wireless-network-service.cfm
To reinforce the learning outcomes of this workshop, we've created a competition based off each of the topics. While we'd like everyone to participate in this competition, it isn't mandatory or required as a part of MSA.
There are prizes up for grabs for the best submissions! 🏆
For the competitiion, we'd like you to create a simple react web app simulating a digital padlock.
- Create a React Web app
- Add 3 counters which can have its count incremented or decremented
- Set a combination (this can be a single hard coded value in the web app)
- When the correct counter combination is entered, display an image somewhere on the page (for example the image could be of an unlocked lock)
- When the incorrect counter combination is entered, display another image somewhere on the page
- Change the styling and design of the web app (this can be something as minor as changing the text colour to something other than black. But feel free to get as creative and make as many CSS/design changes as you want).
- Commit the code of your web app to GitHub.
- Use feature branches and pull requests (within GitHub) during the development of your web app.
We will be judging submissions based on the following:
- Web app works and meets the basic submission guidelines
- Use of Git - feature branches, pull requests, sensible commits (i.e. not commiting the completed project in a single commit at the end)
- Design - We understand good design can be tricky to achieve, but we would like to see good use of CSS to change default styling.
- Any additional features/functionality you think will enhance the experience of your web app - use of animations, functions extra functionality using Typescript etc. Be as creative as you like.
Sunday 16 May 2021 11:59pm