🐻 Going on a Bear Hunt

author: - @astroash

Contents

1. Prerequisites
2. Introduction
3. Path & FS
4. URL & Querystring
5. Request
6. Http

Prerequisites

• understanding of how to run a node server

Introduction

Node allows us to run Javascript outside of the browswer, and is often used to run servers. This workshop is designed to give you experience using a few useful core node modules.

but what is a core module?

A module is code that is written by others for you to use. Node comes with a number of pre written modules, named core modules, which hook into nodes process and allows you to do things you cannot do in vanilla javascript, such as talk to your file system. Core node modules are available in all node projects and do not need to be individually installed.

Setup

As this is a newly cloned repo we need to do a few steps:

1. npm i - this will install any dependencies this project needs
2. npm run start - this will start our server. It has been configured to run with nodemon so that the server will restart anytime you make changes.

The server will run on http://localhost:4000

If you want to know what the the endpoint should look like for any of the exercises run npm run solution and it will start a solutions branch server on http://localhost:5000

Exercise 1 - path & fs module

path

Node is able to access any file on your computer. To find the correct file you can either give it a relative path or an absolute path.

relative path - directions from your current location to the file you are trying to find.

• ./ - start from current directory
• ../ - go one directory up

absolute path - a path which includes the root directory

• __dirname - the full path of the current directory

Path module is full of lots of handy methods to allow you to create and work with paths. Some key ones to know about: path.dirname() - gives the full directory of the passed file. 📝 see docs

path.join() creates a path by joining directories/file names and normalising. This can be used with __dirname to give an absolute path. 📝 see docs

path.extname() returns the extension of a file. 📝 see docs

fs

fs stands for file system. This module has lots of methods that allow to access files on your computer. Some key ones to know about: fs.readFile() - reads the contents of a file on your computer asynchronously. 📝 see docs fs.readFileSync() - same as above but synchronous. 📝 see docs

fs.writeFile() - write a file to your computer asynchronously. 📝 see docs fs.writeFileSync() - same as above but synchronous. 📝 see docs

Let's do it!

• go to the handler for /one
• import path & fs
• create a string of the path to bear_one.jpeg
• read the image using fs
• set the content type to image/jpeg
• return the image using response.end()

Exercise 2 - url & querystring module

url

URLs are split up into lots of different parts:

┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│                                              href                                              │
├──────────┬──┬─────────────────────┬────────────────────────┬───────────────────────────┬───────┤
│ protocol │  │        auth         │          host          │           path            │ hash  │
│          │  │                     ├─────────────────┬──────┼──────────┬────────────────┤       │
│          │  │                     │    hostname     │ port │ pathname │     search     │       │
│          │  │                     │                 │      │          ├─┬──────────────┤       │
│          │  │                     │                 │      │          │ │    query     │       │
"  https:   //    user   :   pass   @ sub.example.com : 8080   /p/a/t/h  ?  query=string   #hash "
│          │  │          │          │    hostname     │ port │          │                │       │
│          │  │          │          ├─────────────────┴──────┤          │                │       │
│ protocol │  │ username │ password │          host          │          │                │       │
├──────────┴──┼──────────┴──────────┼────────────────────────┤          │                │       │
│   origin    │                     │         origin         │ pathname │     search     │ hash  │
├─────────────┴─────────────────────┴────────────────────────┴──────────┴────────────────┴───────┤
│                                              href                                              │
└────────────────────────────────────────────────────────────────────────────────────────────────┘

url module is that gives you methods to work with URLs. You may have noticed we are using it in our router to get the pathname from requests.

url.parse() - parses a url into url object containing:

{
  protocol: string,
  slashes: string,
  auth: string,
  host: string,
  port: string,
  hostname: string,
  hash: string,
  search: string,
  query: string,
  pathname: string,
  path: string,
  href: string 
}

📝 see docs

querystring

Query strings are information sent to the server at the end of a url. They are used for insensitive data on GET requests such as search criteria. They start with a ? and are key value pairs separated by an &. They follow the format: <url>?<key>=<value>&<key2>=<value2>

querystring module offers methods for you to parse and stringify this type of data.

querystring.parse() - parses query strings into an object 📝 see docs

Let's do it

We are going to write this handler so that you can search for bears by querystring eg: /find?bear=one

• go to the handler for /find
• import path & fs & querystring & url
• use url.parse() to get the search query from the url
• use querystring.parse() to get the values from the query string
• check the bear value of the parsed query string. If it is one to four return the correct bear image.
• if there is no matching bear or no bear query given return a 400

Exercise 3 - request module

Request is a very popular module that helps to make HTTP requests as simple as possible and it is built around the Node HTTP core module. Here is a brilliant article on the Request module. This can be used for making api calls from your server. 📝 see docs

Making server side api calls is good for platforms that need an api key, as you can ensure it is kept secret!

Let's do it

We are going to write the /random handler to return a random bear gif.

• install the request module npm i request
• go to https://developers.giphy.com, sign up for an account and then create a new app on their site.
• make an api call to giphy's random endpoint
• return an html <img> element with with the src pointing to giphy

Hint

You can create the string html element by using template literals or adding the string together

Exercise 3 - http module

But I thought that this workshop was about learning core node modules?

You're right! request is not a core module, as it does not come bundled with node. We are going to find out what this module is doing under the hood by rewriting it using the http.get method. 📝 see docs

I've read lots of node's documentation in this workshop already, I am feeling confident with node core modules!

Great! In that case, I'm not going help you!

EEP, but I am stuck...

🌟 Click here for a few hints 🌟

• read the docs
• google for help
• don't look at the solutions branch 🤷🏽‍