12-Nodejs Course 2023: Request Data Types
Tags: node, typescript, mongodb, fastify
Published: 2022-10-30 04:29:24

---
title: 12-Nodejs Course 2023: Request Data Types
published: true
description: 
series: Nodejs Course 2023
tags: nodejs, typescript, mongodb, fastify
#cover_image: 
# Use a ratio of 100:42 for best results.
---

## Request Data Types

We can actually get data from the client in two ways, one from the url and the other from the request body (payload). Let's see how we can get data from the url.

## Data from the URL

We earlier talked about the url structure, we can use the url structure to determine the data that we can receive in our server to act accordingly. we can get it from two places, the query string and the url parameters.

### Query String

The query string is the part of the url that comes after the `?` symbol. It is a list of key-value pairs separated by the `&` symbol. For example, in the url `https://example.com?name=John&age=20`, the query string is `name=John&age=20` this data is converted in the server into an object. We can access this data in the server using the `query` property of the request object, which we will see later.

### URL Parameters

The url parameters are the part of the url that comes after the `/` symbol. For example, in the url `https://example.com/user/1`, the url parameter is `1`. We can access this data in the server using the `params` property of the request object, which we will see later as well.

## Data from the Request Body

The request body is the data that we send to the server in the request body. We can send data in different formats, the most common ones are `JSON` and `form data`. We will see how to handle both of them.

### JSON

JSON is the most common format to send data to the server. We can send JSON data in the request body. We can access this data in the server using the `body` property of the request object.

### Form Data

Form data is another common format to send data to the server. We can send form data in the request body. We can access this data in the server using the `body` property of the request object as well.

The major difference between form data and JSON data is that form data can be sent in different formats, for example, `x-www-form-urlencoded` and `multipart/form-data`, which will allow the user to send files as well, which is not possible with JSON data.

## Request Payload

Request data is sent to the server in the request body. The body is a part of the HTTP request. It is used to send data to the server. The data sent to the server is stored in a buffer. We can parse the data to get a better understanding of it.

## Example of query string

Now let's see some example to illustrate how this works. We will use the `query` property of the request object to get the data from the query string.

We'll try this in our `/users` route which we created earlier, let's just update the controller function.

```ts
// src/app/users/controllers/list-users.ts

export default function listUsers(request) {
    const { query } = request;
    console.log(query);
}
```

Now go to the browser and open the url `http://localhost:3000/users?name=John&age=20`. You should see the following output in the console.

```json
{
    "name": "John",
    "age": "20"
}
```

So this is how we can get data from the query string.

## Example of url parameters

Now let's see some example to illustrate how this works. We will use the `params` property of the request object to get the data from the url parameters.

We'll try this in our `/users/:id` route which we created earlier, let's just update the controller function.

```ts
// src/app/users/controllers/get-user.ts

export default function getUser(request) {
    const { params } = request;
    console.log(params);
}
```

Open now the `users/route.ts` file and add the following code.

```ts
// src/app/users/routes.ts
import getUser from './controllers/get-user';
import router from 'core/router';

router.get('/users/:id', getUser);
```

Now go to the browser and open the url `http://localhost:3000/users/1`. You should see the following output in the console.

```json
{
    "id": "1"
}
```

So this is how we can get data from the url parameters.

The next chapter will be about the request object.

## 🎨 Project Repository

You can find the latest updates of this project on [Github](https://github.com/hassanzohdy/nodejs-2023)

## 😍 Join our community

Join our community on [Discord](https://discord.gg/vtZE9YzaFz) to get help and support (Node Js 2023 Channel).

## 🎞️ Video Course (Arabic Voice)

If you want to learn this course in video format, you can find it on [Youtube](https://www.youtube.com/playlist?list=PLGO8ntvxgiZMJc7RN2lIq9WmMOlWZGzmz), the course is in Arabic language.

## 💰 Bonus Content 💰

You may have a look at these articles, it will definitely boost your knowledge and productivity.

General Topics

- [Event Driven Architecture: A Practical Guide in Javascript](https://dev.to/hassanzohdy/event-driven-architecture-the-best-paradigm-that-i-love-to-work-with-in-javascript-and-node-js-1gnk)
- [Best Practices For Case Styles: Camel, Pascal, Snake, and Kebab Case In Node And Javascript](https://dev.to/hassanzohdy/best-practices-for-case-styles-camel-pascal-snake-and-kebab-case-in-node-and-javascript-55oi)
- [After 6 years of practicing MongoDB, Here are my thoughts on MongoDB vs MySQL
](https://dev.to/hassanzohdy/after-6-years-of-practicing-mongodb-here-are-my-thoughts-on-mongodb-vs-mysql-574b)
-

Packages & Libraries

- [Collections: Your ultimate Javascript Arrays Manager](https://dev.to/hassanzohdy/collections-your-ultimate-javascript-array-handler-3o15)
- [Supportive Is: an elegant utility to check types of values in JavaScript](https://dev.to/hassanzohdy/supportive-is-an-elegant-utility-to-check-types-of-values-in-javascript-1b3e)
- [Localization: An agnostic i18n package to manage localization in your project](https://dev.to/hassanzohdy/mongez-localization-the-simplest-way-to-translate-your-website-regardless-your-favorite-framework-4gi3)

 React Js Packages

- [useFetcher: easiest way to fetch data in React Js](https://dev.to/hassanzohdy/usefetcher-the-easiest-way-to-fetch-data-in-react-45o9)

Courses (Articles)

- [React Js: Let's Create File Manager With React Js and Node Js](https://dev.to/hassanzohdy/lets-create-a-file-manager-from-scratch-with-react-and-typescript-chapter-i-a-good-way-to-expand-your-experience-5g4k)