Giter Site home page Giter Site logo

mariadb-developers / todo-app-nodejs Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 1.0 544 KB

TODO is a simple web application that introduces you to the power, performance, and simplicity of MariaDB. The TODO app contains a React.js front-end and Node.js back-end, which utilizes the MariaDB Node.js connector

License: MIT License

JavaScript 100.00%
mariadb mariadb-database mariadb-skysql nodejs nodejs-driver mariadb-nodejs reactjs mariadb-connector tutorial

todo-app-nodejs's Introduction

TODO

TODO is a web application that introduces you to the power, performance, and simplicity of MariaDB.

This application is made of two parts:

  • Client
    • web UI that communicates with REST endpoints available through an API app (see below).
    • is a React.js project located in the client folder.
  • API

This README will walk you through the steps for getting the TODO web application up and running using MariaDB.

Table of Contents

  1. Requirements
  2. Getting started with MariaDB
  3. Get the code
  4. Create the database and table
  5. Configure, build and run the app
    1. Configure
    2. Build and run the Node.js API app
    3. Build and run the Client app
  6. Support and contribution
  7. License

Requirements

This sample application requires the following to be installed/enabled on your machine:

1.) Getting Started with MariaDB

MariaDB is a community-developed, commercially supported relational database management system, and the database you'll be using for this application.

If you don't have a MariaDB database up and running you can find more information on how to download, install and start using a MariaDB database in the MariaDB Quickstart Guide.

2.) Get the code

First, use git (through CLI or a client) to retrieve the code using git clone:

$ git clone https://github.com/mariadb-developers/todo-app-nodejs.git

Next, because this repo uses a git submodule, you will need to pull the client application using:

$ git submodule update --init --recursive

3.) Create the database and table

Connect to your MariaDB database (from Step #2) and execute the following SQL scripts using the following options:

a.) Use the MariaDB command-line client to execute the SQL contained within schema.sql.

Example command:

$ mariadb --host HOST_ADDRESS --port PORT_NO --user USER --password PASSWORD < schema.sql

OR

b.) Copy, paste and execute the raw SQL commands contained in schema.sql using a client of your choice.

CREATE DATABASE todo;

CREATE TABLE todo.tasks (
  id INT(11) unsigned NOT NULL AUTO_INCREMENT,
  description VARCHAR(500) NOT NULL,
  completed BOOLEAN NOT NULL DEFAULT 0,
  PRIMARY KEY (id)
);

4.) Configure, Build and Run the App

This application is made of two parts:

  • Client
    • web UI that communicates with REST endpoints available through an API app (see below).
    • is a React.js project located in the client folder.
  • API

a.) Configure the app

Configure the MariaDB connection by adding an .env file to the Node.js project. Add the .env file here (the api folder).

Example implementation:

DB_HOST=<host_address>
DB_PORT=<port_number>
DB_USER=<username>
DB_PASS=<password>
DB_NAME=todo

Configuring db.js

The environmental variables from .env are used within the db.js for the MariaDB Node.js Connector configuration pool settings:

var mariadb = require('mariadb');
require('dotenv').config();

const pool = mariadb.createPool({
    host: process.env.DB_HOST, 
    user: process.env.DB_USER, 
    password: process.env.DB_PASS,
    port: process.env.DB_PORT,
    database: process.env.DB_NAME,
    multipleStatements: true,
    connectionLimit: 5
});

Configuring db.js for the MariaDB cloud database service SkySQL

MariaDB SkySQL requires SSL additions to connection. It's as easy as 1-2-3 (steps below).

var mariadb = require('mariadb');
require('dotenv').config();

// 1.) Access the Node File System package
const fs = require("fs");

// 2.) Retrieve the Certificate Authority chain file (wherever you placed it - notice it's just in the Node project root here)
const serverCert = [fs.readFileSync("skysql_chain.pem", "utf8")];

var pools = [
  mariadb.createPool({
    host: process.env.DB_HOST, 
    user: process.env.DB_USER, 
    password: process.env.DB_PASS,
    port: process.env.DB_PORT,
    database: process.env.DB_NAME,
    connectionLimit: 5,
    // 3.) Add an "ssl" property to the connection pool configuration, using the serverCert const defined above
    ssl: {
      ca: serverCert
    }
  })
];

b.) Build and run the app

To start and run the API application you need to execute the following commands within the root folder.

  1. Install the Node.js packages (dependendies) for the app.
$ npm install
  1. Run the the app, which will expose API endpoints via http://localhost:8080.
$ npm start

c.) Build and run the UI (Client) app

Once the API project is running you can now communicate with the exposed endpoints directly (via HTTP requests) or with the application UI, which is contained with the client folder of this repo.

To start the client application follow the instructions here.

Support and Contribution

Please feel free to submit PR's, issues or requests to this project project directly.

If you have any other questions, comments, or looking for more information on MariaDB please check out:

Or reach out to us diretly via:

License

License

todo-app-nodejs's People

Contributors

rhedgpeth avatar

Stargazers

 avatar

Watchers

 avatar

Forkers

singaravelanaws

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.