Giter VIP home page Giter VIP logo

algeo02-20095's Introduction

Gambar Ilustrasi

Image Compressor

IF2123 Aljabar Linear dan Geometri

Gambar diatas diambil dari Flaticon

Kompresi gambar merupakan suatu tipe kompresi data yang dilakukan pada gambar digital. Salah satu algoritma yang dapat digunakan untuk kompresi gambar adalah algoritma SVD (Singular Value Decomposition). Program ini memanfaatkan SVD dalam melakukan kompresi gambar.

Deployment

Program ini dideploy pada http://compress.bayusamudra.my.id. Backend yang digunakan adalah memanfaatkan Heroku.

Struktur Folder

Berikut ini adalah struktur folder dari project ini:

  • Folder test berisi gambar uji yang digunakan
  • Folder doc berisi laporan tugas ini
  • Folder src berisi source program. Pada folder ini terdiri atas:
    • Folder backend berisi program backend. Pada bagian ini berisi algoritma kompresi dan api.
    • Folder frontend berisi program frontend. Pada bagian ini berisi pengaturan tampilan dan lainnya.

Teknologi

Pada project ini, teknologi yang digunakan adalah

  • FastAPI
  • React
  • Socket.IO
  • Python
  • Scipy dan Numpy

Cara menggunakan

Untuk menggunakan program ini, anda dapat menggunakan backend yang telah disediakan ataupun menggunakan backend lokal. Frontend dapat anda akses pada http://compress.bayusamudra.my.id.

Backend Lokal

Notes : Backend terkadang belum stabil. Bila anda mengalami kegagalan saat menggunakan windows, silahkan gunakan WSL.

Untuk menjalankan server lokal, lakukanlah langkah berikut:

  1. Unduh python dan pip versi terbaru. Jika anda menggunakan linux, anda dapat menjalankan perintah berikut
sudo apt install python3 python3-pip python3-virtualenv
  1. Buatlah virtualenv dan aktifkan virtualenv.
virtualenv venv
source ./venv/bin/activate
  1. Install semua dependency
pip install -r requirements.txt
  1. Jalankan backend. Unutk melakukan hal ini, anda dapat menjalankan perintah berikut:
python ./src/backend/main.py

Jika anda ingin menggunakan port selain 80, anda dapat menjalankan dengan perintah berikut:

python ./src/backend/main.py <PORT>

Backend Docker

Anda juga dapat menggunakan docker untuk menjalankan backend. Berikut ini adalah langkah-langkahnya:

  1. Unduh Docker terlebih dahulu
  2. Jika sudah terinstall, jjalankan perintah berikut:
docker build --tag algeo:1.0.0 .
  1. Jalankan docker-compose up
docker-compose up

Frontend Lokal

Bila anda ingin menjalankan frontend lokal, anda dapat melakukan langkah berikut

  1. Install Node.JS versi LTS
  2. Bukalah folder ./src/frontend pada terminal anda.
  3. Jalankan perintah berikut untuk menginstall depedency
npm i
  1. Jalankan perintah tersebut untuk memulai server frontend
npm start
  1. Bukalah browser pada http://localhost:3000

Prosedur Kompresi

  1. Bukalah http://compress.bayusamudra.my.id pada browser.
  2. Koneksikan backend dengan menekan icon colokan.
  3. Masukanlah data server. Anda dapat menggunakan server lokal dan juga server yang telah disediakan. Sebagai catatan, jangan gunakan alamat 127.0.0.1 ataupun localhost. Hal ini dapat anda capai dengan mengubah konfigurasi file hosts.
  4. Bila telah tersambung ke server, drop gambar pada tempat yang telah disediakan.
  5. Tunggu hingga proses selesai.
  6. Anda dapat mengatur tingkat kompresi setelah proses dekomposisi selesai

Catatan

  1. Server hanya dapat menggunakan satu koneksi
  2. Bila anda ingin membatalkan proses, anda dapat melakukan restart browser. Selain itu, anda juga harus melakukan restart backend agar proses yang akan selanjutnya dilakukan tidak terganggu dengan proses sebelumnya.
  3. Bila anda tidak bisa terkoneksi ke server lokal, anda dapat mematikan sementara flag chrome://flags/#block-insecure-private-network-requests pada browser anda. Untuk selengkapnya, anda dapat lihat pada laman ini.

algeo02-20095's People

Contributors

bayusamudra014 avatar firizky29 avatar

Watchers

 avatar

Forkers

firizky29

algeo02-20095's Issues

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.