A Better version of BC UIS. Link to this repository here.
Have Node.js installed. You can install it here
-
clone this repo using:
git clone https://github.com/rogerwangcs/BC-UIS.git -
In cmd or iTerm, go into the repo directory and run
cd client, followed bynpm install -
Start the development server using
npm start -
You're ready to start coding!
- Either run
git pullif you have git installed, or redownload the zip folder from the project repository.
We're using Github to host our web project. Github basically is a platform for coders to collaborate on projects. It's whats called a version control system. It keeps us from losing any important work. When someone, like me or Alex push changes (add our code) to the project repository, everyone can run a git pull command in the terminal in their project root directory (folder) to pull the changes made. This way we can all work at the same time on our own computers; All we need to do is code our own parts of the project and push it and it will all come together in the end.
- The first first 8 tabs should give you a good understanding of what CSS is and what it does.
- Skim through "CSS Introduction" to "CSS Padding".
- Important: We will use CSS extensively and the bulk of our code will be CSS. It's what makes our app look good!
- Html is a markup language, meaning it's used to build the structure and layout of a web page. Fun fact: Mobile platforms such as IOS and Android use very similar markup languages for their view structure.
- If you are new to html, just take a quick skim through the w3schools html guide and you'll get how html code is structured.
Okay is this part is gonna be kinda advanced stuff, and you don't need to know React or Javascript very well for this project. So basically, javascript is the coding language that makes all the logic happen in a web app, like when you click on a button or fill out a form. React.js is a library created by the brainiacs at Facebook to allow building webapps much easier and more efficent.
We've already seen some React code as we explored and experimented in the React template project we set up in our first meeting. If you have time, I really encourage you to watch this quick video on this dude explaining the basics of React. It covers the basic elements and flow of React.
Once again, this all optional, I can explain all the parts you need to know for the project. Here is the official documentation for react by the developers at Facebook. This will be harder to understand, but it has a lot of useful information.