|
| 1 | +# TODO |
| 2 | + |
| 3 | +**TODO** is a web application that introduces you to the power, performance, and simplicity of [MariaDB](https://mariadb.com/products/). |
| 4 | + |
| 5 | +<p align="center" spacing="10"> |
| 6 | + <kbd> |
| 7 | + <img src="media/demo.gif" /> |
| 8 | + </kbd> |
| 9 | +</p> |
| 10 | + |
| 11 | +This application is made of two parts: |
| 12 | + |
| 13 | +* Client |
| 14 | + - web UI that communicates with REST endpoints available through an API app (see below). |
| 15 | + - is a React.js project located in the [client](src/client) folder. |
| 16 | +* API |
| 17 | + - uses [MariaDB Connector/J (JDBC)](https://github.com/mariadb-corporation/mariadb-connector-j) with [Spring](https://spring.io/) to connect to MariaDB. |
| 18 | + - is a .NET solution located int the [api](src/api) folder. |
| 19 | + |
| 20 | +This README will walk you through the steps for getting the TODO web application up and running using MariaDB. |
| 21 | + |
| 22 | +# Table of Contents |
| 23 | +1. [Requirements](#requirements) |
| 24 | +2. [Getting started with MariaDB](#mariadb) |
| 25 | +3. [Get the code](#code) |
| 26 | +4. [Create the database and table](#schema) |
| 27 | +5. [Configure, build and run the apps](#app) |
| 28 | + 1. [Configure](#configure-api-app) |
| 29 | + 4. [Build and run the .NET API app](#build-run-api) |
| 30 | + 5. [Build and run the Client app](#build-run-client) |
| 31 | +6. [Support and contribution](#support-contribution) |
| 32 | +7. [License](#license) |
| 33 | + |
| 34 | +## Requirements <a name="requirements"></a> |
| 35 | + |
| 36 | +This sample application requires the following to be installed/enabled on your machine: |
| 37 | + |
| 38 | +* [Java 8+](https://www.java.com/en/download/) |
| 39 | +* [Maven v.3+](https://maven.apache.org/) |
| 40 | +* [Node.js (v. 12+)](https://nodejs.org/docs/latest-v12.x/api/index.html) (for the Client/UI app) |
| 41 | +* [NPM (v. 6+)](https://docs.npmjs.com/) (for the Client/UI app) |
| 42 | +* [MariaDB command-line client](https://mariadb.com/products/skysql/docs/clients/mariadb-clients/mariadb-client/) (optional), used to connect to MariaDB database instances. |
| 43 | + |
| 44 | +## 1.) Getting Started with MariaDB <a name="mariadb"></a> |
| 45 | + |
| 46 | +[MariaDB](https://mariadb.com) is a community-developed, commercially supported relational database management system, and the database you'll be using for this application. |
| 47 | + |
| 48 | +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](https://github.com/mariadb-developers/mariadb-getting-started). |
| 49 | + |
| 50 | +## 2.) Get the code <a name="code"></a> |
| 51 | + |
| 52 | +First, use [git](git-scm.org) (through CLI or a client) to retrieve the code using `git clone`: |
| 53 | + |
| 54 | +``` |
| 55 | +$ git clone https://github.com/mariadb-developers/todo-app-python.git |
| 56 | +``` |
| 57 | + |
| 58 | +Next, because this repo uses a [git submodule](https://git-scm.com/book/en/v2/Git-Tools-Submodules), you will need to pull the [client application](https://github.com/mariadb-developers/todo-app-client) using: |
| 59 | + |
| 60 | +```bash |
| 61 | +$ git submodule update --init --recursive |
| 62 | +``` |
| 63 | + |
| 64 | +## 3.) Create the database and table <a name="schema"></a> |
| 65 | + |
| 66 | +[Connect to your MariaDB database](https://mariadb.com/products/skysql/docs/clients/) (from [Step #2](#mariadb)) and execute the following SQL scripts using the following options: |
| 67 | + |
| 68 | +a.) Use the [MariaDB command-line client](https://mariadb.com/products/skysql/docs/clients/mariadb-clients/mariadb-client/) to execute the SQL contained within [schema.sql](schema.sql). |
| 69 | + |
| 70 | +_Example command:_ |
| 71 | +```bash |
| 72 | +$ mariadb --host HOST_ADDRESS --port PORT_NO --user USER --password PASSWORD < schema.sql |
| 73 | +``` |
| 74 | + |
| 75 | +**OR** |
| 76 | + |
| 77 | +b.) Copy, paste and execute the raw SQL commands contained in [schema.sql](schema.sql) using a [client of your choice](https://mariadb.com/products/skysql/docs/clients/). |
| 78 | + |
| 79 | +```sql |
| 80 | +CREATE DATABASE todo; |
| 81 | + |
| 82 | +CREATE TABLE todo.tasks ( |
| 83 | + id INT(11) unsigned NOT NULL AUTO_INCREMENT, |
| 84 | + description VARCHAR(500) NOT NULL, |
| 85 | + completed BOOLEAN NOT NULL DEFAULT 0, |
| 86 | + PRIMARY KEY (id) |
| 87 | +); |
| 88 | +``` |
| 89 | + |
| 90 | +## 4.) Configure, Build and Run the App <a name="app"></a> |
| 91 | + |
| 92 | +This application is made of two parts: |
| 93 | + |
| 94 | +* Client |
| 95 | + - web UI that communicates with REST endpoints available through an API app (see below). |
| 96 | + - is a React.js project located in the [client](src/client) folder. |
| 97 | +* API |
| 98 | + - uses [MariaDB Connector/J (JDBC)](https://github.com/mariadb-corporation/mariadb-connector-j) with [Spring](https://spring.io/) to connect to MariaDB. |
| 99 | + - is a .NET solution located int the [api](src/api) folder. |
| 100 | + |
| 101 | +The following steps, `a` through `c`, will walk you through the process of configuring, building and running the `api` and `client` applications. |
| 102 | + |
| 103 | +### a.) Configure the app <a name="configure-api-app"></a> |
| 104 | + |
| 105 | +Configure the MariaDB connection with your connection details in [application.properties](src/api/main/resources). |
| 106 | + |
| 107 | +Example implementation: |
| 108 | + |
| 109 | +``` |
| 110 | +spring.datasource.url=jdbc:mariadb://localhost:3306/todo |
| 111 | +spring.datasource.username=app_user |
| 112 | +spring.datasource.password=Password123! |
| 113 | +spring.datasource.driver-class-name=org.mariadb.jdbc.Driver |
| 114 | +``` |
| 115 | + |
| 116 | +### b.) Build and run the [API app](src/api) <a name="build-run-api"></a> |
| 117 | + |
| 118 | +Once you have retrieved a copy of the code you're ready to build and run the project! Start by opening a terminal and navigating to the root of the [api](src/api) folder, then... |
| 119 | + |
| 120 | +i. Build the project by executing the following CLI command: |
| 121 | + |
| 122 | +``` |
| 123 | +$ mvn package |
| 124 | +``` |
| 125 | + |
| 126 | +ii. Run the project by executing the following CLI command: |
| 127 | + |
| 128 | +```bash |
| 129 | +$ mvn spring-boot:run |
| 130 | +``` |
| 131 | + |
| 132 | +### c.) Build and run the [UI (Client) app](src/client) <a name="build-run-client"></a> |
| 133 | + |
| 134 | +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](src/client) folder of this repo. |
| 135 | + |
| 136 | +To start the [client](src/client) application follow the instructions [here](https://github.com/mariadb-developers/todo-app-client). |
| 137 | + |
| 138 | +## Support and Contribution <a name="support-contribution"></a> |
| 139 | + |
| 140 | +Please feel free to submit PR's, issues or requests to this project project directly. |
| 141 | + |
| 142 | +If you have any other questions, comments, or looking for more information on MariaDB please check out: |
| 143 | + |
| 144 | +* [MariaDB Developer Hub](https://mariadb.com/developers) |
| 145 | +* [MariaDB Community Slack](https://r.mariadb.com/join-community-slack) |
| 146 | + |
| 147 | +Or reach out to us diretly via: |
| 148 | + |
| 149 | + |
| 150 | +* [MariaDB Twitter](https://twitter.com/mariadb) |
| 151 | + |
| 152 | +## License <a name="license"></a> |
| 153 | +[](https://opensource.org/licenses/MIT) |
0 commit comments