- π I am a master's student in Computer Science from Korea, currently living in LA, USA.
- π« How to reach me: [email protected]
serverless-repo-app's Introduction
serverless-repo-app's People
serverless-repo-app's Issues
Say Hello to VSCode
Say "Hello" to VS Code
β Tasks:
- Download Visual Studio Code and install the Azure Tools and Live Server extensions
- Clone this repo using the terminal on VS Code and create a new branch named
hello
- In a new file called
helloworld.js
, write and export a JS functionhello
that returns "Hello World" - Commit your changes to the
hello
branch move on - Create a pull request that merges
hello
tomain
, but do not merge it -- you will find the next step once you have successfully created the pull request and committed correct code
π‘ Tip: When we tell you to name a file called directory/thefile.js
, the first part before the /
is a directory (otherwise known as a folder).
π§ Test your Work
If you run node helloworld.js
in the terminal, the output should be Hello World
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!
β My code failed, what do I do?
No worries, check this out to help resolve the issue.
π‘ TIP: If you want to re-run a check without comitting something else, check this out.
1: The IDE - Visual Studio Code
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).
π» How to set up your VS Code Environment
Download VS Code for your operating system and check out this tutorial before getting started.
Inside VS Code, download the following extensions:
- Azure Tools (includes Azure Account, Azure App Service, Azure Functions)
- 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:
π‘ Note: Dark Theme is our personal favorite, but feel free to choose whichever theme you like best. Go to this site to view your options!
2: GitHub with VS Code
Check out this awesome documentation about how to set up Git on your local computer
β How do I use GitHub on VS Code?
- Once you have complete the steps in the documentation, clone this repo on your computer
- Use the following commands to work with branches in the terminal:
- Check which branch you're in:
git branch
- Create a new branch and change into it:
git checkout --b name-of-branch
- Change branch:
git checkout name-of-branch
- Afterwards, follow this tutorial by VS Code on connecting to GitHub straight from the app!
git pull
before making any changes to your local repo!!
3: Writing and Exporting a Javascript function
JavaScript enables the ability to export functions 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 for CounselorBot to check your code.
β What are JavaScript and Node?
Javascript is the language of the internet! It is a powerful tool for creating complex web apps. However, JavaScript can be used for building the client for applications, and sometimes requires a way to access this client, which is also known as the server-side. Node.js is the solution to this problem, and allows you to write and run code not linked to a website locally.
β Make sure you have Node.js and npm installed before moving forwards: https://www.npmjs.com/get-npm
- Check if node is installed: run
node -v
in your terminal - Check if npm is installed: run
npm -v
in your terminal
If you would like to read more, refer to this article on JavaScript and this article on Node.
β How do I export a function?
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:
function hello() {
// your code
}
exports.hello = 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:
let hello = require('../../helloworld.js')
let output = hello.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.
β Can I have more detailed steps?
- Create a new file
- Name the file helloworld.js
- Write your code
- If you have node installed on your computer, open terminal on VS Code and type 'node helloworld.js'
- If you have not installed node on your computer, you will need to do that first: https://nodejs.org/en/download/
- Tip: to test your function, call it in your code.
- Create a new branch named
week1
and commit yourhelloworld.js
file in the root directory.
π‘ Try to not use the web editor! Commit from your command line.
4: Commiting to a repository using a command line?
Start out by downloading Git. Then, open your command line.
The Commands
Navigate to the directory in your command line where you want to keep your repository.
Tip: Use
cd ./your-directory
to change directories,pwd
to find out where you are, andls
to list files & directories. More information is here.
Cloning your repository
Click on "Code" on your repo's page and find your repo's HTTP link:Use the git clone
command and replace the url to get your repository's files onto your local computer:
git clone https://github.com/example/example.git
Now is the time to make your changes to your code!
Committing and pushing code
First, "stage" your changes. You will be specifying what files you want to commit the changes of.Stage helloworld.js
changes only:
git add helloworld.js
Stage ALL your changes to the repository:
git add *
Next, let's commit the code. Usually, your commits will be a group of changes that make sense together. Add a description!
git commit -m "insert your description"
Save your commits to the repository on Github!
git push
For more information, refer to this link
Congrats! Your changes should now be visible on Github
β Don't forget to git pull
before making any changes to your local repo!! This gets any changes that were made by the bot.
Application Completed :)
Congratulations!!
Next Steps:
- Paste the link to this repo into this form (make sure this repo is public)
- You have finished the application to Bit Project's Serverless Camp. We will reach out to you if you are selected. Good luck!
Getting Cat Pics with Postman
Getting Cat Pics with Postman π±
In this step, you will be using Postman Desktop Application to test the CataaS API by sending a GET request.
β Tasks:
- Read and explore the documentation for the Cataas API
- With Postman, specify the API Endpoint and set the parameters to send a GET request to the CataaS API and receive a cat picture with "Serverless" written on it
- Comment, but do not
Close with comment
, the picture you receive from the API in this issue to move on
1: Exploring the CataaS API
CATAAS is a RESTful API that exclusively delivers images of cats. The main feature is that we can change the properties of images, add text, truncate the image, add a filter and more. It's not an API with many real-world applications, but it's perfect for learning.
β Interested in playing around with the API? Documentation is here.
β How does the cloud work?
"The cloud" refers to servers that are accessed over the Internet, and the software and databases that run on those servers. Cloud servers are located in data centers all over the world. By using cloud computing, users and companies don't have to manage physical servers themselves or run software applications on their own machines.
β What are HTTP Requests?
A server is a computer that provides (serves) data to other computers, called clients. Clients connect to servers through the internet.
Clients communicate with servers with through HTTP requests
. For example, when you are on your favorite browser and look up YouTube.com, you are making an HTTP "get" request to the server to load the contents from YouTube.com.
β What are some examples of request types??
Below are some of the most common HTTP requests. Read through each one, and try to get familiar with their functions!
β Get Request: gets data from a server (hence the name). The data we want is specified using a URL we call a Request URL. In this case, you will use a Get Request URL from the Catass API to receive a cat picture.
β Post Request: used to send data to a server, to create or update a resource. The information submitted to the server is archived in the request body of the HTTP request. This is often used to send user-generated data to a server. An example could be uploading a picture to a Post URL.
β Put Request: similar to a Post Request, but a put request will always have the same result every time you use one, whereas a post request might not. We call this property "idempotency."
β Delete Request: used to delete resources indicated by the URL and will remove the targeted resources.
β What are APIs, and what makes one "RESTful?"
An API is a piece of software that lets two other pieces of software talk to each other! Imagine you're driving a car - the wheel and pedals would be like APIs between you and the car, since they allow you to controll the car easily.
Most of the time, an API will be used to connect an app to an external service. For example, the Twitter API could allow a user to automatically receive updates on tweets concerning a particular topic or event.
Any API that follows these 5 rules is, by definition, RESTful.
You don't need to worry about the 5 rules, but if you're curious...
- Internally, the API should keep the things the user does and the things the server does separate.
- The server shouldn't ever need to store the user's data to function.
- All output data from the API should mark itself as either "cacheable" or "non-cacheable" (cacheable data can be stored and reused later by the user, while non-cacheable data should be discarded and recomputed by the API every time).
- The user shouldn't be able to tell whether or not they're communicating with the API's server, or an intermediary server.
- The interface of the API should conform to a few agreed-upon conventions (that we won't be going over here).
2: Sending Requests with Postman
In this step, we'll be using a desktop application called Postman to test an API. Postman is a debugging tool for RESTful APIs, which allows you to test both pre-existing, community made APIs, or your own self-made APIs, without having to write any HTML test code!
Postman offers a web tool to test API's, but during the camp we will be using the desktop application.
- You can sign up for Postman here.
- Download and install the desktop application here
- Read the "Getting Started" documentation here
β How do we build requests?
The Postman documentation covers:
- Creating requests
- Adding request detail
- Setting request URLs
- Selecting request methods
- Sending parameters
- Sending body data
- Authenticating requests
- Configuring request headers
Open up the Postman application and try it out yourself:
- API endpoint: https://cataas.com/cat/cute/says/Serverless
- Parameters:
color
(color of the text) andsize
(font size)
β How do I specify the API Endpoint?
Enter https://cataas.com/cat/cute/says/Serverless, which is the API endpoint, into the text box next to GET
β How do I set the parameters?
Click on "Params" and enter color
into Key and the color you want (eg. blue) into Value. Enter size
into the next Key row and a number (eg. 50) into Value.
Note on parameters:
- the
size
parameter refers to the font size of your caption. It has a limit at around 1,200.- Colors are pretty hit or miss; since the Cat API is on the web, but it generally adheres to HTML color names. Expect values such as "blue, green, yellow" to work.
- The API can take very large words as input for the caption, however only 34 characters can be seen on the picture at one time .
Click Send
to get your cat picture
Getting Cat Pics with Postman
Getting Cat Pics with Postman π±
In this step, you will be using Postman Desktop Application to test the CataaS API by sending a GET request.
β Tasks:
- Read and explore the documentation for the Cataas API
- With Postman, specify the API Endpoint and set the parameters to send a GET request to the CataaS API and receive a cat picture with "Serverless" written on it
- Comment, but do not
Close with comment
, the picture you receive from the API in this issue to move on
1: Exploring the CataaS API
CATAAS is a RESTful API that exclusively delivers images of cats. The main feature is that we can change the properties of images, add text, truncate the image, add a filter and more. It's not an API with many real-world applications, but it's perfect for learning.
β Interested in playing around with the API? Documentation is here.
β How does the cloud work?
"The cloud" refers to servers that are accessed over the Internet, and the software and databases that run on those servers. Cloud servers are located in data centers all over the world. By using cloud computing, users and companies don't have to manage physical servers themselves or run software applications on their own machines.
β What are HTTP Requests?
A server is a computer that provides (serves) data to other computers, called clients. Clients connect to servers through the internet.
Clients communicate with servers with through HTTP requests
. For example, when you are on your favorite browser and look up YouTube.com, you are making an HTTP "get" request to the server to load the contents from YouTube.com.
β What are some examples of request types??
Below are some of the most common HTTP requests. Read through each one, and try to get familiar with their functions!
β Get Request: gets data from a server (hence the name). The data we want is specified using a URL we call a Request URL. In this case, you will use a Get Request URL from the Catass API to receive a cat picture.
β Post Request: used to send data to a server, to create or update a resource. The information submitted to the server is archived in the request body of the HTTP request. This is often used to send user-generated data to a server. An example could be uploading a picture to a Post URL.
β Put Request: similar to a Post Request, but a put request will always have the same result every time you use one, whereas a post request might not. We call this property "idempotency."
β Delete Request: used to delete resources indicated by the URL and will remove the targeted resources.
β What are APIs, and what makes one "RESTful?"
An API is a piece of software that lets two other pieces of software talk to each other! Imagine you're driving a car - the wheel and pedals would be like APIs between you and the car, since they allow you to controll the car easily.
Most of the time, an API will be used to connect an app to an external service. For example, the Twitter API could allow a user to automatically receive updates on tweets concerning a particular topic or event.
Any API that follows these 5 rules is, by definition, RESTful.
You don't need to worry about the 5 rules, but if you're curious...
- Internally, the API should keep the things the user does and the things the server does separate.
- The server shouldn't ever need to store the user's data to function.
- All output data from the API should mark itself as either "cacheable" or "non-cacheable" (cacheable data can be stored and reused later by the user, while non-cacheable data should be discarded and recomputed by the API every time).
- The user shouldn't be able to tell whether or not they're communicating with the API's server, or an intermediary server.
- The interface of the API should conform to a few agreed-upon conventions (that we won't be going over here).
2: Sending Requests with Postman
In this step, we'll be using a desktop application called Postman to test an API. Postman is a debugging tool for RESTful APIs, which allows you to test both pre-existing, community made APIs, or your own self-made APIs, without having to write any HTML test code!
Postman offers a web tool to test API's, but during the camp we will be using the desktop application.
- You can sign up for Postman here.
- Download and install the desktop application here
- Read the "Getting Started" documentation here
β How do we build requests?
The Postman documentation covers:
- Creating requests
- Adding request detail
- Setting request URLs
- Selecting request methods
- Sending parameters
- Sending body data
- Authenticating requests
- Configuring request headers
Open up the Postman application and try it out yourself:
- API endpoint: https://cataas.com/cat/cute/says/Serverless
- Parameters:
color
(color of the text) andsize
(font size)
β How do I specify the API Endpoint?
Enter https://cataas.com/cat/cute/says/Serverless, which is the API endpoint, into the text box next to GET
β How do I set the parameters?
Click on "Params" and enter color
into Key and the color you want (eg. blue) into Value. Enter size
into the next Key row and a number (eg. 50) into Value.
Note on parameters:
- the
size
parameter refers to the font size of your caption. It has a limit at around 1,200.- Colors are pretty hit or miss; since the Cat API is on the web, but it generally adheres to HTML color names. Expect values such as "blue, green, yellow" to work.
- The API can take very large words as input for the caption, however only 34 characters can be seen on the picture at one time .
Click Send
to get your cat picture
It is Late!
Running Late β°
- Create a new branch from
main
namedlate
. - Create a function
running_late(date)
in JavaScript that returnsIt is late!
if the time is at or after 10:00 PM, andIt is still early!
if it is not. - Once the function is created, export it at the bottom of your file:
exports.running_late = running_late
(so we can test your code!) - Commit your code to the
late
branch. - Create a pull request to merge the
late
branch ontomain
, and only merge the pull request when the bot approves your changes.
β for this step, edit the
late.js
file
π¨ Function Specs:
Function name: running_late(date)
Arguments:
date
- a string that thenew Date()
is created from.
Do NOT use
Date.now()
The
date
argument will be in this format:December 17, 1995 03:24:00
Return:
- Either
It is late!
orIt is still early!
, depending on the time.
π§ Resources:
- Date() constructor
π Test your work:
β if the time is 8:00 AM, your function should return It is still early!
β if the time is 11:30 PM, your function should return It is late!
π‘ Make sure to put the line module.exports = running_late
at the end of your file so we can test your code!
Max Nums
Max Numbers π
- Create a new branch from
main
namedmax
. - Create a function
find_max(arr)
that takes in an array as a parameter and returns the element with the maximum value in the array. - Once the function is created, export it at the bottom of your file:
exports.find_max = find_max
(so we can test your code!) - Commit your code to the
max
branch. - Create a pull request to merge the
max
branch ontomain
, and only merge the pull request when the bot approves your changes.
β for this step, edit the
max_nums.js
file
π¨ Function Specs:
Function name: find_max(arr)
Arguments:
arr
- the array that is passed into thefind_max
function
Return:
- the maximum element in the
arr
array
π§ Resources:
- For-loops
π Test your work:
β if the array passed in is [1, 78, 12, 2, 5, 10]
, the function should return 78
β if the array passed in is [1, 2, 3, 3, -1]
, the function should return 3
π‘ Make sure to put the line module.exports = find_max
at the end of your file so we can test your code!
Start Course
Click the big green button that says Submit new issue
, and you'll be good to go!
Getting Started with Serverless
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.
β Tasks:
- Optional: complete the get started with GitHub guide.
- Create a new branch named
test
. - Add a paragraph introducing yourself under the
About Me
section in theblog.md
file in root. - Commit the change to
test
. - Draft a pull request to your
main
branch, naming itAdding self introduction
and add a detailed description of your contribution. - Whenver you're ready, click
ready for review
- If the bot approves your changes, merge the pull request.
What is GitHub?
GitHub is a industry-standard platform allows developers to save and collaborate on code. 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.
Check out "The Github Flow" for more information on issues, pull requests, committing, and branches!
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.
βοΈVocabulary
βΌοΈ Repositories
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.
βΌοΈ Issues
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.
π‘ On usual repositories in the contributing world issues are tasks or bugs that need to be completed or fixed.
βΌοΈ Fork
If you want to contribute to someone else's code, you would "fork" it. This creates a copy of the code under your account that you can make changes to. Create a fork when you want to make changes to someone else's code and contribute to it.
βΌοΈ Branch
Creating a branch on a repository is like forking a repository. You would do this when you want to make changes to your code without harming a working version.
βΌοΈ Pull Request
Once you make changes on a forked repository or another branch, you might need to bring the changes into the "main" repository. This allows YOUR changes to be visible in the main project! *You are basically asking for permission to "merge" your changes."
This allows you to:
β Collaborate on code
β Make comments
β Review the contributions made
βΌοΈ Command Line Interface
A Command Line Interface (CLI) is your computer's visual application for accessing its operating system. There are different types of CLIs for different operating systems, such as Terminal for MacOs and PowerShell for Windows. If you have Windows, make sure to also install Git Bash for a better tool. In upcoming issues, we will refer to your CLI as your Terminal or Command Line, but remember that they mean the same thing!
Key functions you should be familiar with after this task include:
- Committing changes
- Forking a repository
- Making a new branch
- Making a pull request
β What do all the emojis mean?
Glad that you asked!Emoji | Meaning |
---|---|
π‘ | Helpful tips |
Important info | |
β | Question you may have |
β | Features |
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.