Skip to content

Commit 3a23ea7

Browse files
committed
Initial additions
1 parent 3702ab0 commit 3a23ea7

21 files changed

+1156
-0
lines changed

.gitmodules

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
[submodule "src/client"]
2+
path = src/client
3+
url = https://github.com/mariadb-developers/todo-app-client.git

README.md

+153
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
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+
[![License](https://img.shields.io/badge/License-MIT-blue.svg?style=plastic)](https://opensource.org/licenses/MIT)

media/demo.gif

233 KB
Loading

src/api/.gitignore

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
*#
2+
*.iml
3+
*.ipr
4+
*.iws
5+
*.jar
6+
*.sw?
7+
*~
8+
.#*
9+
.*.md.html
10+
.DS_Store
11+
.classpath
12+
.factorypath
13+
.gradle
14+
.idea
15+
.metadata
16+
.project
17+
.recommenders
18+
.settings
19+
.springBeans
20+
/code
21+
MANIFEST.MF
22+
_site/
23+
activemq-data
24+
bin
25+
build
26+
!/**/src/**/bin
27+
!/**/src/**/build
28+
build.log
29+
dependency-reduced-pom.xml
30+
dump.rdb
31+
interpolated*.xml
32+
lib/
33+
manifest.yml
34+
out
35+
overridedb.*
36+
target
37+
transaction-logs
38+
.flattened-pom.xml
39+
secrets.yml
40+
.gradletasknamecache
41+
.sts4-cache

src/api/HELP.md

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# Getting Started
2+
3+
### Reference Documentation
4+
For further reference, please consider the following sections:
5+
6+
* [Official Apache Maven documentation](https://maven.apache.org/guides/index.html)
7+
* [Spring Boot Maven Plugin Reference Guide](https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/maven-plugin/reference/html/)
8+
* [Create an OCI image](https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/maven-plugin/reference/html/#build-image)
9+
* [Spring Data JPA](https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/htmlsingle/#boot-features-jpa-and-spring-data)
10+
* [Spring Web](https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/htmlsingle/#boot-features-developing-web-applications)
11+
12+
### Guides
13+
The following guides illustrate how to use some features concretely:
14+
15+
* [Accessing Data with JPA](https://spring.io/guides/gs/accessing-data-jpa/)
16+
* [Building a RESTful Web Service](https://spring.io/guides/gs/rest-service/)
17+
* [Serving Web Content with Spring MVC](https://spring.io/guides/gs/serving-web-content/)
18+
* [Building REST services with Spring](https://spring.io/guides/tutorials/bookmarks/)
19+

src/api/README.md

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
# TODO - Java Spring Boot (with JDBC) API
2+
3+
1. [Requirements](#requirements)
4+
2. [Getting started with the app](#getting-started)
5+
1. [Configure the code](#configure-code)
6+
2. [Build the code](#build-code)
7+
3. [Run the app](#run-app)
8+
9+
## Requirements <a name="requirements"></a>
10+
11+
This sample was created using the following techologies and they must be installed before proceeding.
12+
13+
* [Java 8+](https://www.java.com/en/download/)
14+
* [Maven v.3+](https://maven.apache.org/)
15+
16+
## Getting started with the app <a name="getting-started"></a>
17+
18+
### Configure the code <a name="configure-code"></a>
19+
20+
Configure the MariaDB connection with your connection details in [application.properties](src/main/resources).
21+
22+
Example implementation:
23+
24+
```
25+
spring.datasource.url=jdbc:mariadb://localhost:3306/todo
26+
spring.datasource.username=app_user
27+
spring.datasource.password=Password123!
28+
spring.datasource.driver-class-name=org.mariadb.jdbc.Driver
29+
```
30+
31+
### Build the code <a name="build-code"></a>
32+
33+
Once you have retrieved a copy of the code you're ready to build and run the project!
34+
35+
Build the project by executing the following CLI command:
36+
37+
```
38+
$ mvn package
39+
```
40+
41+
### Run the app <a name="run-app"></a>
42+
43+
Once you've pulled down the code and have verified built the project you're ready to run the application!
44+
45+
1. Execute the following CLI command
46+
47+
```bash
48+
$ mvn spring-boot:run
49+
```
50+
51+
The following steps also exist within the ["Build and run"](../../#build-and-run-the-app-) section of the root README, and are for startin the React.js project once this API project has been started.
52+
53+
2. Navigate to the [../../client](client) folder and execute the following CLI command to start the React.js application.
54+
55+
```bash
56+
$ npm install
57+
$ npm start
58+
```
59+
60+
3. Open a browser window and navigate to http://localhost:3000.

0 commit comments

Comments
 (0)