username

password

Gain insights into AdonisJs fundamentals. Delve into routes, controllers, middleware, and hooks. Discover practical examples, illustrations, and quizzes to confidently build your full-stack applications.

sim.tar.gz

volad

volad-copy

volad-try

volad-copy-copy

volad-try-copy

logger

This course is a detailed guide to AdonisJs. AdonisJs, inspired by Laravel, is a Node.js framework that allows developers to build full-stack web applications and micro-API servers. 

In this course, you will cover the fundamentals: routes, controllers, middleware, hooks, and more. Each chapter contains code examples and illustrations to enhance your learning, and you will also be able to quiz yourself on the materials covered. 

By the time you are done with the course, you'll have plenty of hands-on practice, and will be able to confidently write your full-stack applications in AdonisJs.

Building Full-Stack Web Applications with AdonisJs

# Getting values from a submitted form

Let's say we want to get the values from a submitted form. In the code below, we will create an HTML form to get the product ID and product name from the user. We will then get these values inside a controller.

HOST=0.0.0.0
PORT=3333
NODE_ENV=development
APP_URL=http://${HOST}:${PORT}
CACHE_VIEWS=false
APP_KEY=
DB_CONNECTION=mysql
DB_HOST=mysql
DB_PORT=3306
DB_USER=root
DB_PASSWORD=root
DB_DATABASE=newsletter
DB_SOCKETPATH=
SESSION_DRIVER=cookie
HASH_DRIVER=bcrypt

'use strict'

/*
|--------------------------------------------------------------------------
| Ace Commands
|--------------------------------------------------------------------------
|
| The ace file is just a regular Javascript file but with no extension. You
| can call `node ace` followed by the command name and it just works.
|
| Also you can use `adonis` followed by the command name, since the adonis
| global proxy all the ace commands.
|
*/

const { Ignitor } = require('@adonisjs/ignitor')

new Ignitor(require('@adonisjs/fold'))
  .appRoot(__dirname)
  .fireAce()
  .catch(console.error)


'use strict'

/*
|--------------------------------------------------------------------------
| Http server
|--------------------------------------------------------------------------
|
| This file bootstrap Adonisjs to start the HTTP server. You are free to
| customize the process of booting the http server.
|
| """ Loading ace commands """
|     At times you may want to load ace commands when starting the HTTP server.
|     Same can be done by chaining `loadCommands()` method after
|
| """ Preloading files """
|     Also you can preload files by calling `preLoad('path/to/file')` method.
|     Make sure to pass relative path from the project root.
*/

const { Ignitor } = require('@adonisjs/ignitor')

new Ignitor(require('@adonisjs/fold'))
  .appRoot(__dirname)
  .fireHttpServer()
  .catch(console.error)


React

Dart

GoJS React

Typescript React

Vue.js

> Press Run and wait for the output to be displayed in the Output tab. You will see a form. Then, click on the link under the Run button, enter values in the form and click on "submit" to see the entered values.

## Explanation

We begin by creating a simple form using HTML in **resources/views/add.edge**. It takes the `product_id` and `product_name` from the user. With AdonisJs, we can have cross-site forgery protection. We can access the CSRF token by adding `{{csrfField()}}`.

Next, we update the **app/Controllers/Http/TestController.js** to create a function called `add()` that returns the add view. In lines 8-11, we create the `product` function that uses the `request.input()` method to get the values of `product_id` and `product_name` from the submitted form. 

Notice that in lines 12-13 we use the `request.only('product_id', 'product_name'])` method to achieve the same result. Feel free to uncomment these lines to verify this.

Lastly, we register the routes in lines 20-21 of **start/routes.js**.

# Getting the URL query parameters

Suppose we have the URL **.../details?id=2&tag=new**, and we want to obtain the query parameters. We can write the following code in **start/routes.js** to achieve this:

Look at how we can use the request methods to get values using the request object.

Introduction

Routing and Middleware

Controllers and Views

Request and Response

Session, Validator, and Logger

Database

Hooks, Mail, and Events

Tests

Conclusion

Appendix

Using Request Methods

Getting values from a submitted form