test-sv-fullstack

Aplikasi Web Fullstack Manajemen Artikel Menggunakan Go dan Vuejs

Aplikasi manajemen post artikel berbasis web.

• Frontend: VueJS, Tailwindcss
• Backend (RESTful API): Go
• DBMS MySQL
• Dilengkapi dengan Postman Collection

Fitur

• Membuat artikel baru. Form artikel terdiri dari Title, Content, dan Category
• Mengupdate artikel
• Menghapus artikel (memindahkan artikel ke tab Trashed)
• Artikel terdiri dari status "Published", "Draft", dan "Trashed"
• Setiap tabel artikel pada tab, menggunakan pagination
• Melihat preview blog (dengan pagination)

Instalasi

1. Clone Project

https://github.com/ahmadfaisalridwan94/test-sv-fullstack.git

2. Backend

Install dependencies

untuk mendownload paket-paket yang diperlukan dan menginstalnya, jalankan

cd test-sv-fullstack/backend
go get

Konfigurasi database

Buka file .env pada directory backend

.env

Ubah menyesuikan dengan konfigurasi db

DB_HOST=127.0.0.1
DB_DRIVER=mysql 
DB_USER=root
DB_PASSWORD=
DB_NAME=article
DB_PORT=3306 #Default mysql port

Membuat database dengan menjalankan query berikut

CREATE DATABASE article

Membuat tabel posts dengan menjalankan query berikut

CREATE TABLE `posts` (
  `Id` INT unsigned NOT NULL AUTO_INCREMENT,
  `Title` VARCHAR(200) NOT NULL,
  `Content` TEXT NOT NULL,
  `Category` VARCHAR(100) NOT NULL,
  `CreatedAt` TIMESTAMP NOT NULL DEFAULT current_timestamp(),
  `UpdatedAt` TIMESTAMP NOT NULL DEFAULT current_timestamp(),
  `Status` VARCHAR(100) NOT NULL,
  PRIMARY KEY (`Id`)
) ENGINE=InnoDB

Atau dapat juga membuat tabel posts dengan menggunakan migrate

migrate -database "mysql://root@tcp(localhost:3306)/article" -path database/migrations up

Menjalankan server backend

go run main.go

3. Frontend

Install dependencies

cd test-sv-fullstack/frontend
npm install

Konfigurasi base url

frontend/src/services/api/axios.js

Menjalankan aplikasi frontend

npm run dev