Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit cb42b03

Browse files
committed
updated links/readings week 1
1 parent b346201 commit cb42b03

File tree

8 files changed

+120
-72
lines changed

8 files changed

+120
-72
lines changed

README.md

Lines changed: 27 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,19 @@ Welcome to JavaScript3! Congratulations on making it this far. You're well on yo
99

1010
A big part of being a programmer means moving data from one place to another. It also means working with other people's software. In this module you'll be learning about one of the core things of what makes a web developer: working with APIs!
1111

12-
On top of that you'll also learn how to think differently about how you write your programs. Like in any field, once you've mastered a particular way of doing things you start thinking about how it could be done differently. In programming we call these `paradigms` and in this module you'll learn one such paradigm: Object-Oriented Programming!
12+
On top of that you'll also learn how to think differently about _how_ you write your programs. Like in any field, once you've mastered a particular way of doing things you start thinking about how it could be done in a smarter, different way. In programming we call these `paradigms` and in this module you'll learn one such paradigm: Object-Oriented Programming!
1313

1414
## Learning goals
1515

1616
In order to successfully complete this module you will need to master the following:
1717

18-
- Learn what an API is
19-
- Catch up on the history of JavaScript
20-
- Understand how to write more readable asynchronous JavaScript
21-
- Connect with different public APIs
22-
- Build a Single Page Application (SPA)
18+
- Learn what an `Application Programming Interface` (API) is
19+
- Catch up on the `history of JavaScript`
20+
- Understand how to write more readable `asynchronous JavaScript`
21+
- Connect with different `public APIs`
22+
- Build a `Single Page Application` (SPA)
2323
- Work with pre-existing code
24-
- Learn about Object-Oriented Programming
24+
- Learn about `Object-Oriented Programming`
2525

2626
## How to use this repository
2727

@@ -37,19 +37,19 @@ If you have any questions or if something is not entirely clear ¯\\\_(ツ)\_/¯
3737

3838
## Before you start
3939

40-
In the following weeks we will be using a `styleguide` to help you write _"clean code"_. What is a styleguide? Simply put, it's a set of design standards put in one collection. Companies create and use them to define their public identity (their "brand"). Watch the following to get a better idea:
40+
### Setup Style Guide
4141

42-
- [Creating Your Company's Style Guide](https://www.youtube.com/watch?v=gv_wrrY70E0)
42+
In the following weeks we will be using a front-end `style guide` to help you write _"clean code"_. What is a style guide? Simply put, it's a set of coding standards put into one collection.
4343

44-
A styleguide is made by designers. In the case of website design, this styleguide is then handed over to developers to use when styling the frontend.
44+
- [Front-end Style Guides](https://fronteers.nl/congres/2015/sessions/front-end-style-guides-anna-debenham)
4545

46-
The styleguide we'll be using is the one from Airbnb:
46+
The style guide we'll be using is the one from Airbnb:
4747

4848
- [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript)
4949

5050
While you do not need to read this guide in detail, it is recommended that you look at sections 1-8, 12-13, 15-21 and 23.
5151

52-
The required packages you need to install in order to write code according to the styleguide are the following:
52+
The required packages you need to install before you write code according to the style guide are the following:
5353

5454
```json
5555
"eslint"
@@ -60,13 +60,26 @@ The required packages you need to install in order to write code according to th
6060
"prettier"
6161
```
6262

63-
They are already in this repository's `package.json` so all you have to do now to prepare is to execute the following command in your command line:
63+
They are already in this repository's `package.json` so all you have to do now to prepare is to execute the following command at the root of this module directory:
6464

6565
```md
6666
npm install
6767
```
6868

69-
With this out of the way we can get started!
69+
### Forking the right repository
70+
71+
Before you start with the homework, make sure you've made a fork of the right repository: [HackYourHomework/JavaScript3](https://www.github.com/hackyourhomework/javascript3)). Once you've cloned it to your computer you can proceed by making GIT branches for each week. Start at the `master` branch and execute the following (note that they're 3 different commands):
72+
73+
```bash
74+
foo@bar:~$ git branch week1-YOURNAME
75+
foo@bar:~$ git branch week2-YOURNAME
76+
foo@bar:~$ git branch week3-YOURNAME
77+
```
78+
79+
Then execute `git checkout week1` and you can get started!
80+
81+
If you have any questions or if something is not entirely clear ¯\_(ツ)\_/¯, please ask/comment on Slack!
82+
7083

7184
## Planning
7285

Week1/MAKEME.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -15,49 +15,49 @@ This week's concepts can be challenging, therefore let's get an easy introductio
1515

1616
## **2. JavaScript exercises**
1717

18-
> Inside of your `JavaScript3` fork and inside of the `Week1` folder, create a folder called `homework`. Inside of that folder, create a folder called `js-exercises`. For all the following exercises create a new `.js` file in that folder (3 files in total). Make sure the name of each file reflects its content: for example, the filename for exercise one could be placeKitten.js.
18+
> Inside of your `JavaScript3` fork and inside of the `Week1` folder, create a folder called `homework`. Inside of that folder, create a folder called `js-exercises`. For all the following exercises create a new `.js` file in that folder (3 files in total). Make sure the name of each file reflects its content: for example, the filename for exercise one could be `getRandomUser.js`.
1919
2020
**Exercise 1: Who do we have here?**
2121

2222
Wouldn't it cool to make a new friend with just the click of a button?
2323

24-
Write a function that makes an API call to `https://www.randomuser.me/api`
24+
Write a function that makes a HTTP Request to `https://www.randomuser.me/api`
2525

26-
- Inside the same file write two functions: one with `XMLHttpRequest`, and the other with `axios`
27-
- Each function should make an API call to the given endpoint: `https://www.randomuser.me/api`
26+
- Inside the JavaScript file write two functions: one with `XMLHttpRequest`, and the other with `axios`
27+
- Each function should make a HTTP Request to the given endpoint: `https://www.randomuser.me/api`
2828
- Log the received data to the console
29-
- Incorporate error handling
29+
- Incorporate error handling: log to the console the error message
3030

3131
**Exercise 2: Programmer humor**
3232

3333
Who knew programmers could be funny?
3434

35-
Write an function that makes an API call to `https://xkcd.now.sh/?comic=latest`
35+
Write a function that makes a HTTP Request to `https://xkcd.now.sh/?comic=latest`
3636

3737
- Inside the same file write two programs: one with `XMLHttpRequest`, and the other with `axios`
38-
- Each function should make an API call to the given endpoint: `https://xkcd.now.sh/?comic=latest`
38+
- Each function should make a HTTP Request to the given endpoint: `https://xkcd.now.sh/?comic=latest`
3939
- Log the received data to the console
4040
- Render the `img` property into an `<img>` tag in the DOM
41-
- Incorporate error handling
41+
- Incorporate error handling: log to the console the error message
4242

4343
**Exercise 3: Dog photo gallery**
4444

4545
Let's make a randomized dog photo gallery!
4646

47-
Write a function that makes an API call to `https://dog.ceo/api/breeds/image/random`. It should trigger after clicking a button in your webpage. Every time the button is clicked it should append a new dog image to the DOM.
47+
Write a function that makes a HTTP Request to `https://dog.ceo/api/breeds/image/random`. It should trigger after clicking a button in your webpage. Every time the button is clicked it should append a new dog image to the DOM.
4848

4949
- Create an `index.html` file that will display your random image
5050
- Add 2 `<button>` and 1 `<ul>` element, either in the HTML or through JavaScript
5151
- Write two versions for the button functionality: one with `XMLHttpRequest`, and the other with `axios`
52-
- When any one of the 2 buttons is clicked it should make an API call to `https://dog.ceo/api/breeds/image/random`
52+
- When any one of the 2 buttons is clicked it should make a HTTP Request to `https://dog.ceo/api/breeds/image/random`
5353
- After receiving the data, append to the `<ul>` a `<li>` that contains an `<img>` element with the dog image
54-
- Incorporate error handling
54+
- Incorporate error handling: log to the console the error message
5555

5656
## **3. Code along**
5757

5858
Now that you've learned about APIs and how to connect with them, let's apply it in the context of a complete application.
5959

60-
In the following application you'll be making an API call to an external, public API.
60+
In the following application you'll be making a HTTP Request to an external, public API. You'll use that data in order to fetch facts that you'll display in your own application: a Numbers Facts application.
6161

6262
Enjoy!
6363

@@ -139,7 +139,7 @@ The assignment for this week is to produce a functional application that looks s
139139

140140
Functionally, the application should do the following:
141141

142-
1. Make an API call to the endpoint: https://api.github.com/orgs/HackYourFuture/repos?per_page=100
142+
1. Make a HTTP Request to the endpoint: https://api.github.com/orgs/HackYourFuture/repos?per_page=100
143143
2. Display the first 10 items in the HTML file (write JavaScript to add element to the DOM)
144144
3. Show feedback when an error has happened
145145

0 commit comments

Comments
 (0)