atjhoendz / qrary-semantic-frontend

Frontend qrary semantic

Qrary Semantic

Qrary semantic is a website version from Qrary Android Mobile application, which in this application we apply SPARQL with RDF turtle for the database technology. The main function of this website is to search the book in the database using a semantic system. The applying of semantic is the innovation we add from the mobile version.
View Demo »

Table of Contents

• About the Project
  • Built With
• Getting Started
  • Prerequisites
  • Installation
    • Setup Jena Fuseki Service
    • Setup Backend Service
    • API Documentation
    • Setup Frontend Service
• Usage
• Dataset Schema
• Development Progress
• Contact

About The Project

Overview

Built With

• Vue JS
• Express JS
• Jena Fuseki

Getting Started

Prerequisites

Make sure your environment has ready by installing these down below:
- Docker
- Node 12 and up

Installation

To run project locally :

Setup Jena Fuseki Service

1. Clone https://github.com/atjhoendz/qrary-jena-fuseki-service

git clone https://github.com/atjhoendz/qrary-jena-fuseki-service.git

2. Open terminal into directory project

cd qrary-jena-fuseki-service

3. Run the docker

docker-compose up -d

4. The service will be run on http://localhost:3030

Upload Dataset

1. Go to Jena Fuseki Service
   

local : http://localhost:3030
Demo : https://qrary-fuseki-service.herokuapp.com/

2. Click manage dataset
3. Add new Dataset with name qrary
4. Choose Dataset Type = Persistent
5. Upload the ttl file to the dataset

turtle file: https://raw.githubusercontent.com/atjhoendz/qrary-jena-fuseki-service/master/dataset/qrary.ttl

6. Wait until upload data success

Setup Backend Service

1. Clone https://github.com/atjhoendz/qrary-semantic-backend

git clone https://github.com/atjhoendz/qrary-semantic-backend.git

2. Move to the directory

cd qrary-semantic-backend

3. For the first time, build the project first

docker-compose build

4. After this build, you just run it

docker-compose up -d

or

make rundev

5. The service will be run on http://localhost:3000/api

Demo backend: https://qrary-semantic-backend.herokuapp.com/api

API Documentation

https://documenter.getpostman.com/view/10257401/SztD4Sg6

Setup Frontend Service

1. Clone https://github.com/atjhoendz/qrary-semantic-frontend

git clone https://github.com/atjhoendz/qrary-semantic-frontend.git

2. Move to directory project

cd qrary-semantic-frontend

3. Install dependencies

npm install

4. Serve it

npm run serve

5. The service will be run on http://localhost:8080

Demo Frontend: https://qrary-semantic.herokuapp.com/

Usage

1. Open frontend service

local: http://localhost:8080
demo: https://qrary-semantic.herokuapp.com/

2. Open it in Mobile Device and Add to home screen (recommended)
3. Go to Pencarian menu
4. Search your favorite book at the search bar (ex: Laskar Pelangi)

Dataset Schema

Development Progress

• Create mockup layout
• Implement frontend layout
• Setup jena fuseki
• Setup backend API
• Get all book data
• Get spesific book data
• Search book
• Advanced search book

Contact

• Mohamad Achun Armando - [e-mail]
• Arif Rhizky Gilang - [e-mail]
• Refa Annisatul Ilma - [e-mail]