Giter VIP home page Giter VIP logo

mariadb-developers / places-app-jdbc-spring Goto Github PK

View Code? Open in Web Editor NEW
2.0 1.0 1.0 466 KB

Places is a web application that allows you to record all of your favorite locations using both structured (relational) and semi-structured (JSON) data! The Places app contains a React.js front-end and Java (Maven) project back-end, which utilizes MariaDB Connector/J (JDBC) and Spring Data.

License: MIT License

Java 100.00%
mariadb mariadb-database mariadb-connector mariadb-json json json-data java jdbc jdbc-driver mariadb-jdbc

places-app-jdbc-spring's Introduction

Places

Places is a web application backed by the power, performance, and simplicity of MariaDB, allows you to record all of your favorite locations using both structured (relational) and semi-structured (JSON) data!

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 Places web application up and running using MariaDB.

Table of Contents

  1. Requirements
  2. Getting started with MariaDB and JSON
  3. Get the code
  4. Configure, build and run the apps
    1. Configure
    2. Build and run the API app
    3. Build and run the Client app
  5. JSON Data Models
  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 and JSON

Set up a MariaDB database, loaded with the data this sample needs, using the MariaDB JSON Quickstart, before continuing to the next step.

2.) Get the code

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

$ git clone https://github.com/mariadb-developers/places-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.) 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

The following steps, a through c, will walk you through the process of configuring, building and running the api and client applications.

a.) Configure the app

Configure the MariaDB connection with your connection details in application.properties.

Example implementation:

spring.datasource.url=jdbc:mariadb://localhost:3306/places
spring.datasource.username=root
spring.datasource.password=Password123!
spring.datasource.driver-class-name=org.mariadb.jdbc.Driver

b.) Build and run the Java API app

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 folder, then...

i. Build the project by executing the following CLI command:

$ mvn package

ii. Run the project by executing the following CLI command:

$ mvn spring-boot:run

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.

JSON Data Models

Below are samples of the data model per Location Type.

Attraction (A)

{
   "category":"Landmark",
   "lastVisitDate":"11/5/2019"
}

Restuarant (R)

{
   "details":{
      "foodType":"Pizza",
      "menu":"www.giodanos.com/menu"
   },
   "favorites":[
      {
         "description":"Classic Chicago",
         "price":24.99
      },
      {
         "description":"Salad",
         "price":9.99
      }
   ]
}

Sports Venue (S)

{
   "details":{
      "yearOpened":1994,
      "capacity":23500
   },
   "events":[
      {
         "date":"10/18/2019",
         "description":"Bulls vs Celtics"
      },
      {
         "date":"10/21/2019",
         "description":"Bulls vs Lakers"
      },
      {
         "date":"11/5/2019",
         "description":"Bulls vs Bucks"
      },
      {
         "date":"11/5/2019",
         "description":"Blackhawks vs Blues"
      }
   ]
}

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

places-app-jdbc-spring's People

Contributors

rhedgpeth avatar

Stargazers

 avatar  avatar

Watchers

 avatar

Forkers

wuyuan2009123

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.