search

lazyplatypus / week1changes

0 stars 0 forks source link

Getting Started #1

Open ghost opened 3 years ago

ghost commented 3 years ago

Learning GitHub

This week, you will be going through steps to set up tools needed to be successful in this camp. If you are already familiar with some, feel free to skip to the end and complete the task to move on.

GitHub

:question: What is Github?
GitHub is a platform that is widely used in the tech industry, that enables code hosting and makes collaboration for coding a seamless process. You can use GitHub to manage your files, changes in your project, version control (the ability to revert back to previous versions of your code as well as versions developed by other programmers), and more. [Get started with GitHub](https://guides.github.com/activities/hello-world/)

Check out "The Github Flow" for more information on issues, pull requests, committing, and branches!

:question: Help! How does Github work?
:question: What is a Repo?
Repositories (or repos) are essentially **folders where you can store files of code.** The repo of our camp was duplicated into your account when you clicked "Create Template" so that you can commit changes and complete each lesson. For our camp, each week is placed inside an issue. Only when you complete the week (committing the necessary code and commenting), will the issue close and you can move on to the next issue. Don’t worry – committing changes is easier than it sounds.

:exclamation: How can I use GitHub Desktop to commit my code?
1. Download GitHub desktop. This is one way you can commit changes to the cabin repo to complete each lesson here. 2. To have access to the cabin repository on GitHub desktop, the name of your repo needs to be entered in the top-left corner in the box with placeholder “Filter” and “Clone Repository” should be selected. clone 3. Click “Pull Origin” once the repo is cloned to pull to GitHub desktop the most current version of the learning lab. 4. Open VSCode by clicking the button “Open in Visual Studio Code”. The files in the learning lab will be opened in VS code, and now you can complete the lesson (adding the necessary code). You need to add your code in a new file, so make sure you create a new file under the folder in VSCode. When you are done creating your new file and adding the necessary code, save the file and return to GitHub desktop. 5. The change will be shown. Add a summary and description of your change and then click “Commit to main”. Next, click “Push origin”, to push the change made in VSCode to the website. steps4desktop *Remember, each step and lesson is posted on the repo on github.com. You will commit changes when the lesson instructs you to, and once you click “Push origin” and refresh the GitHub page, the issue will close and you can move on.*

:exclamation: Help! I don't know how to use it and I need more information.
If you want to learn more about what it is and how to use it, try taking this GitHub Learning Lab Course. After finishing it, you will have a strong understanding of all the features GitHub has to offer.

One very important rule... Don't work on your code in the web editor. This is bad practice, and you will regret it later.

:question: What should I do instead?
Install Github Desktop and commit from your local computer. We'll go over code editors next if you don't have one to work on your code locally. You can also use git on your commandline.

:pencil: Task 1: Create a new branch named test, add a sentence introducing yourself to the end of the README.md file, and commit the change to test. Then, make a pull request to your main branch and merge the edits.

Pull Request Guidelines

Key functions you should be familiar with after this task include:

:camping: To move on, make sure you commit the change and merge the branch!

ghost commented 3 years ago

Week 1 Step 2

Getting Started

Downloading an IDE

This week, you will be going through steps to set up tools needed to be successful in this camp. If you are already familiar with some, feel free to skip to the end and complete the task to move on.

Visual Studio Code

:computer: Download VSCode and install some extensions!
**Visual Studio Code (or VSCode) was downloaded from this link: https://code.visualstudio.com** Inside VSCode, you downloaded four extensions: **Azure Account, Azure App Service, Azure Functions, and Live Server.** All of the Azure extensions allow you to work on your Azure Function App in VS code instead of working directly through the Microsoft portal. Live Server is a quick and temporary testing server, and you can use it to test HTML pages. To launch, right click on your html file and press "Open with Live Server" or click "Go Live" in the bottom right corner: Screen Shot 2021-01-10 at 1 53 20 PM Screen Shot 2021-01-10 at 1 53 40 PM

:question: What is an IDE and why do we need it?
Before we start coding, we need to install an IDE. An IDE is a software application that provides comprehensive facilities to computer programmers for software development. An IDE normally consists of at least a source code editor, build automation tools, and a debugger. Although there are hundreds of IDEs to choose from, we are going to use Visual Studio Code due to its popularity and integration with Azure (via extensions and libraries).

:exclamation: OK, how do I install it?
To install VSC, go to: https://code.visualstudio.com/download and choose your operating system (ie. Windows, Mac, Linux, etc). Then click **Download** and run the installer (usually a `.exe` or `.zip` file). After it's installed, open it up and try it out. If you need some help navigating VSC, check out this super helpful YouTube video.

Make sure to use Dark Theme unless you want to live life on the edge...

:pencil: Task 2: Code and export a JavaScript function named hello that returns "Hello World" in a file named helloworld.js. Commit the file to the root directory of a new branch called week1.

:exclamation: Why and how do I export a function?
JavaScript enables the ability to [export functions](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export) in a program so that you can access them in other parts of the program via the import statement. In this case, we want to export your programs in order to run them across the testing code. Let's say your function name is `hello`. To export it, add this line of code at the very bottom of your file outside of your function: `module.exports = hello`. Example: ```js function hello() { // your code } module.exports = hello ``` When you commit the file, we will try to run the function by importing it and compare it's output to the expected output like so: ```js let hello = require('../../helloworld.js') let output = hello() ``` #### How does this apply to code in the real world? Just like you can import code from modules other people have written, you can also **import functions you wrote from *other files* to reuse them.** In function oriented programming, you use functions over and over again to save code. If you want to use the function `hello()` in another file, you would need to import it.

:exclamation: Can I have more detailed steps?
1. Create a new file 2. Name the file helloworld.js 3. Write your code 4. If you have node installed on your computer, open terminal on VS Code and type 'node helloworld.js' 5. If you have not installed node on your computer, you will need to do that first: https://nodejs.org/en/download/ 6. Tip: to test your function, call it in your code. 7. Create a new branch named `week1` and commit your `helloworld.js` file in the root directory.

:camping: Make sure you export the function, and commit helloworld.js to the root directory of a new branch week1 in this repository to move on!

Note: From now on, you will never need to close an issue. The Counselor will do that for you, create new issues, and new comments for further instructions!