Image Uploader

โปรแกรมอัพโหลดรูปภาพ

โปรแกรมอัปโหลดรูปภาพแบบโอเพ่นซอร์สที่โฮสต์ด้วยตนเอง
สำรวจเอกสาร »

Dockerhub Frontend · Dockerhub Backend · รายงานจุดบกพร่อง · คุณสมบัติคำขอ

สารบัญ

1. เกี่ยวกับโครงการ
   • สร้างด้วย
2. เริ่มต้นใช้งาน
   • โฮสติ้งด้วย Docker
   • การตั้งค่ามันขึ้นมา
   • เรียกใช้ไฟล์นักเทียบท่า
   • การเปลี่ยน URL
   • การโฮสต์ด้วย Node
   • เรียกใช้ไฟล์นักเทียบท่า
   • การเปลี่ยน URL
3. แผนการทำงาน
4. มีส่วนร่วม
5. ใบอนุญาต
6. ติดต่อ

เกี่ยวกับโครงการ

มีผู้อัปโหลดรูปภาพจำนวนหนึ่งบนอินเทอร์เน็ต แต่ฉันไม่พบผู้อัปโหลดใดที่เป็นโอเพ่นซอร์สเต็มรูปแบบ มีขนาดเล็ก และสร้างขึ้นเพื่อการโฮสต์ด้วยตนเอง ดังนั้นฉันจึงสร้างมันขึ้นมาเองและหวังว่าคุณจะสนุกไปกับมัน

คุณยังอาจแนะนำการเปลี่ยนแปลงด้วยการฟอร์ก Repo นี้และสร้างคำขอดึงหรือเปิดปัญหา ขอขอบคุณทุกคนที่มีส่วนร่วมในการขยายโครงการนี้!

สร้างด้วย

นี่คือรายการเฟรมเวิร์กหลักที่ฉันใช้สำหรับโปรเจ็กต์นี้

• ตอบสนอง
• ด่วน
• วัสดุ-UI

เริ่มต้นใช้งาน

มีสองวิธีในการโฮสต์โครงการนี้ คุณสามารถใช้นักเทียบท่าหรือโฮสต์มันด้วยโหนด ฉันขอแนะนำอย่างยิ่งให้โฮสต์มันด้วยนักเทียบท่าเพราะมันมีความยืดหยุ่นมากกว่า

โฮสติ้งด้วย Docker

การตั้งค่ามันขึ้นมา

ในการโฮสต์โปรเจ็กต์ คุณจะต้องสร้างไฟล์นักเทียบท่า ไฟล์เหล่านี้กำลังรวมอิมเมจนักเทียบท่าหลายตัวเพื่อโต้ตอบกัน

ไฟล์จะต้องเรียกว่า docker-compose.yml ให้วางโค้ดต่อไปนี้ลงในไฟล์

แทรกใน docker-compose.yml :

 version : " 3.8 "
services :
    frontend :
        image : vallezw/image-uploader-client
        ports :
            - " 80:80 "
        environment :
            - " API_URL=http://localhost:5000 "
            - " CLIENT_URL=http://localhost "
        
    backend :
        image : vallezw/image-uploader-backend 
        ports :
            - " 5000:5000 "
        volumes :
            - .upload/:/usr/src/app/upload 

เรียกใช้ไฟล์นักเทียบท่า

เมื่อคุณตั้งค่าไฟล์เสร็จแล้วคุณสามารถดำเนินการต่อไปได้

1. อาคาร

   docker-compose build

2. เป็นเจ้าภาพจัดโครงการ

   docker-compose up

การเปลี่ยน URL

ในกรณีที่คุณต้องการโฮสต์โปรเจ็กต์โดยไม่มี Docker คุณก็สามารถทำได้เช่นกัน

...
environment :
    - " API_URL=http://your_api_url:your_port "
    - " CLIENT_URL=http://your_client_url:your_port "

หลังจากนั้นคุณก็พร้อมที่จะโฮสต์มันบนโดเมนที่คุณกำหนดเอง

การโฮสต์ด้วย Node

ดำเนินโครงการ

นี่คือตัวเลือกสำหรับผู้ที่ไม่ต้องการโฮสต์ด้วยนักเทียบท่า

1. ไปที่ไดเร็กทอรีแบ็กเอนด์ด้วยเทอร์มินัล/powershell

    cd backend/

2. ติดตั้งแพ็คเกจบริการ npm เพื่อโฮสต์โปรเจ็กต์

   npm install -g serve

3. สร้างและรันมัน

   npm run build

การเปลี่ยน URL

ในกรณีที่คุณต้องการเปลี่ยน URL คุณต้องเปลี่ยนตัวแปร env

1. ไปที่ไดเร็กทอรีส่วนหน้าแล้วเปิดไฟล์ .env
2. เปลี่ยน API_URL และ CLIENT_URL เป็นกรณีการใช้งานเฉพาะของคุณ

    API_URL = http://your_api_url:your_port
    CLIENT_URL = http://your_client_url:your_port

หลังจากนั้นคุณก็พร้อมที่จะโฮสต์มันบนโดเมนที่คุณกำหนดเอง

แผนการทำงาน

ดูปัญหาที่เปิดอยู่สำหรับรายการคุณลักษณะที่นำเสนอ (และปัญหาที่ทราบ)

มีส่วนร่วม

การมีส่วนร่วมคือสิ่งที่ทำให้ชุมชนโอเพ่นซอร์สเป็นสถานที่ที่น่าทึ่งสำหรับการเรียนรู้ สร้างแรงบันดาลใจ และสร้างสรรค์ การมีส่วนร่วมใด ๆ ที่คุณทำจะ ได้รับการชื่นชมอย่างมาก

1. ส้อมโครงการ
2. สร้าง Feature Branch ของคุณ ( git checkout -b feature/AmazingFeature )
3. ยอมรับการเปลี่ยนแปลงของคุณ ( git commit -m 'Add some AmazingFeature' )
4. พุชไปที่สาขา ( git push origin feature/AmazingFeature )
5. เปิดคำขอดึง

ใบอนุญาต

เผยแพร่ภายใต้ใบอนุญาต MIT ดู LICENSE สำหรับข้อมูลเพิ่มเติม

ติดต่อ

วาเลนติน ซแวร์ชเก – @vallezw

ลิงค์โครงการ: github.com/vallezw/Image-Uploader