Welcome agent! You have made it this far so we know we can trust you. BitProject is working in an undercover operation, and we need a new way to communicate.
✅ Tasks:
[x] Run git pull and create a new branch called morse
[x] 1: Install the morse-code-converter package
[x] 2: Code an HTTP trigger function named morse with the npm package morse-code-converter. This HTTP trigger takes in a plaintext parameter (which is in english) returns a response of morse code.
[ ] 3: Place the function URL of your new Morse Code HTTP Trigger as a repository secret named MORSE_ENDPOINT and commit your function's code to a file named morse/index.js to the morse branch
[ ] 4: Create a pull request that merges morse to main, and only merge the PR when the bot approves your changes
1: Installing Packages
Create a new HTTP trigger function using the Azure extension in VSCode, and choose the Function App you previously created during this week.
We will be using the morse-code-converter npm package.
❓ Why do we need these "packages" and what are they?
Packages are awesome! They're chunks of publicly available code that someone else has written to help make coding easier for everyone else. These packages reusable code that increases functionality in your code.
Before the Azure Function can run the code we will write, we have to install all the necessary package dependencies. These packages contain **code that we will "depend on" in the application**; we have to install them in the console using `npm install`.
>💡 [What is a package?](https://www.w3schools.com/nodejs/nodejs_npm.asp)
>💡 [What is the morse-code-converter package?](https://www.npmjs.com/package/morse-code-converter)
❓ How do I install the package?
In VS Code, open your terminal.
>💡 On Windows or Mac, go to the header of your window, and go to `Terminal --> New Terminal`.
![image](https://user-images.githubusercontent.com/69332964/125171153-b42f6300-e180-11eb-88d0-34ef48451069.png)
Enter these commands in order:
```sh
npm init -y
npm install morse-code-converter
```
‼️ Woah! What just happened when the package was installed?
The first command created a **package.json** file to store your dependencies and essentially keeps track of what packages your application needs. You can find this file by going into the left menu and clicking on "App Files".
The next one actually installs the necessary packages with code, `morse-code-converter`.
>💡 Note: If you get red text like `WARN`, you can ignore it.
‼️ Reminder: don't forget to import your package! `const morse = require("morse-code-converter");
💡 Make sure your parameter is named plaintext
2: Using morse-code-converter
❓ How do I receive the English as a parameter?
[Query parameters](https://rapidapi.com/blog/api-glossary/parameters/query/) can be accessed from the `req` object in the input of the `module.exports` function.
>💡 Since ours is named `plaintext`, we can access it with `req.query.plaintext`.
**How would I send the English?**
[place your function url here]&plaintext=[insert the English]
❓ How do I use the Morse Code package?
**Tip**: Try reading the [documentation](https://www.npmjs.com/package/morse-code-converter) first.
1. First require the npm package at the top of your code.
```js
const morse = require("morse-code-converter");
```
2. Query the url for the parameter `plaintext`, and store it in a variable.
3. Create a variable named code, but set it to `undefined` for right now, because we are not sure if `plaintext` contains a value or not (we can't translate nothing 🤔)
4. To check if the user passed in nothing for plaintext, we need to use an `if-else` [conditional](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else).
5. We first check if the user did not pass in a parameter of `plaintext` at all, or if `plaintext` has no value. In which case, we will tell them to enter some text.
```js
if (typeof plaintext === 'undefined' || plaintext === "") {
code = "Please enter some text to convert!"
}
```
> 💡 the `||` means `or` in JavaScript. Either the left side can be `true`, or the right side can be `true`, and the code inside the `if` will run!
6. Now that we checked if the user has entered nothing, we can add code that will execute when the user has entered something for `plaintext`. Add the code below after the entire `if` statement (after the opening and closing brackets).
```js
else {
code = morse.textToMorse(plaintext);
}
```
7. Now, we just need to respond to the HTTP request with `code`! The final `if-else` code should look like:
```js
if (typeof plaintext === 'undefined' || plaintext === "") {
code = "Please enter some text to convert!"
}
else {
code = morse.textToMorse(plaintext);
}
```
💡 Be sure to return the code in the body of the response!
:question: Um. Body?
**Tip**: `context.res` is the object you use to return a response to the user.
```js
context.res = {
body: [insert your encoded English here]
};
```
:exclamation: Don't forget to git pull before making any changes to your local repo!!
‼️ Remember: we test your Morse Code function everytime you commit!
Week 1 Step 8 ⬤⬤⬤⬤⬤⬤⬤⬤◯ | 🕐 Estimated completion: 5-15 minutes
[TOP SECRET] Morse Code Converter
✅ Tasks:
git pull
and create a new branch calledmorse
morse-code-converter
packagemorse
with the npm packagemorse-code-converter
. This HTTP trigger takes in aplaintext
parameter (which is in english) returns a response of morse code.MORSE_ENDPOINT
and commit your function's code to a file namedmorse/index.js
to themorse
branchmorse
tomain
, and only merge the PR when the bot approves your changes1: Installing Packages
Create a new HTTP trigger function using the Azure extension in VSCode, and choose the Function App you previously created during this week.
We will be using the
morse-code-converter
npm package.❓ Why do we need these "packages" and what are they?
Packages are awesome! They're chunks of publicly available code that someone else has written to help make coding easier for everyone else. These packages reusable code that increases functionality in your code. Before the Azure Function can run the code we will write, we have to install all the necessary package dependencies. These packages contain **code that we will "depend on" in the application**; we have to install them in the console using `npm install`. >💡 [What is a package?](https://www.w3schools.com/nodejs/nodejs_npm.asp) >💡 [What is the morse-code-converter package?](https://www.npmjs.com/package/morse-code-converter)❓ How do I install the package?
In VS Code, open your terminal. >💡 On Windows or Mac, go to the header of your window, and go to `Terminal --> New Terminal`. ![image](https://user-images.githubusercontent.com/69332964/125171153-b42f6300-e180-11eb-88d0-34ef48451069.png) Enter these commands in order: ```sh npm init -y npm install morse-code-converter ```‼️ Woah! What just happened when the package was installed?
The first command created a **package.json** file to store your dependencies and essentially keeps track of what packages your application needs. You can find this file by going into the left menu and clicking on "App Files". The next one actually installs the necessary packages with code, `morse-code-converter`. >💡 Note: If you get red text like `WARN`, you can ignore it.‼️ Reminder: don't forget to import your package! `const morse = require("morse-code-converter");
2: Using morse-code-converter
❓ How do I receive the English as a parameter?
[Query parameters](https://rapidapi.com/blog/api-glossary/parameters/query/) can be accessed from the `req` object in the input of the `module.exports` function. >💡 Since ours is named `plaintext`, we can access it with `req.query.plaintext`. **How would I send the English?** [place your function url here]&plaintext=[insert the English]❓ How do I use the Morse Code package?
**Tip**: Try reading the [documentation](https://www.npmjs.com/package/morse-code-converter) first. 1. First require the npm package at the top of your code. ```js const morse = require("morse-code-converter"); ``` 2. Query the url for the parameter `plaintext`, and store it in a variable. 3. Create a variable named code, but set it to `undefined` for right now, because we are not sure if `plaintext` contains a value or not (we can't translate nothing 🤔) 4. To check if the user passed in nothing for plaintext, we need to use an `if-else` [conditional](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else). 5. We first check if the user did not pass in a parameter of `plaintext` at all, or if `plaintext` has no value. In which case, we will tell them to enter some text. ```js if (typeof plaintext === 'undefined' || plaintext === "") { code = "Please enter some text to convert!" } ``` > 💡 the `||` means `or` in JavaScript. Either the left side can be `true`, or the right side can be `true`, and the code inside the `if` will run! 6. Now that we checked if the user has entered nothing, we can add code that will execute when the user has entered something for `plaintext`. Add the code below after the entire `if` statement (after the opening and closing brackets). ```js else { code = morse.textToMorse(plaintext); } ``` 7. Now, we just need to respond to the HTTP request with `code`! The final `if-else` code should look like: ```js if (typeof plaintext === 'undefined' || plaintext === "") { code = "Please enter some text to convert!" } else { code = morse.textToMorse(plaintext); } ```:question: Um. Body?
**Tip**: `context.res` is the object you use to return a response to the user. ```js context.res = { body: [insert your encoded English here] }; ```:exclamation: Don't forget to
git pull
before making any changes to your local repo!!‼️ Remember: we test your Morse Code function everytime you commit!
📹 Walkthrough Video