lofi music

lofi-music?

โครงการ React 18 + NextJS สร้างขึ้นเพื่อความสนุกสนาน ฉันเบื่อที่จะเปิด YouTube สำหรับเพลง lo-fi ขณะทำงาน?

คลิกที่นี่เพื่อสาธิตสด!

เกี่ยวกับ

Lofi-Music เป็นเว็บแอปพลิเคชันที่ช่วยให้คุณสร้างเพลงที่กำหนดเองในขณะที่ทำงานหรือเรียน! เพียงคลิกเสียงใด ๆ ที่คุณต้องการจากการเลือกที่กว้างเพื่อซ้อนทับลงในการผสมผสานที่กำหนดเอง

สร้างขึ้นด้วย

• ส่วนประกอบสไตล์
• ส่วนประกอบ/เค้าโครงตาม
• สวยกว่าสำหรับการอ่านที่ดีขึ้น

✅เริ่มต้น

ก่อนอื่นให้โคลน repo ไปยังอุปกรณ์ของคุณโดยใช้คำสั่ง:

 git clone https://github.com/riccardobertolini/lofi-music.git

จากนั้นเปลี่ยนไดเรกทอรีเป็น lofi-music ด้วยคำสั่ง:

 cd lofi-music

ถัดไปเรียกใช้คำสั่งต่อไปนี้เพื่อติดตั้งโมดูลทั้งหมดและการอ้างอิงของพวกเขา:

npm install

การใช้งาน

ในการเรียกใช้แอพในโหมดการพัฒนาให้เรียกใช้คำสั่งต่อไปนี้:

npm run dev

จากนั้นเปิด http: // localhost: 3000 (พอร์ตเริ่มต้น) เพื่อดูในเบราว์เซอร์

ในการสร้างแอพสำหรับการผลิตไปยังโฟลเดอร์ build เรียกใช้:

npm run build

❓คำแนะนำ

• ในการสร้าง เสียงผสม ให้คลิกที่ภาพเพื่อเพิ่มลงในเสียงที่ใช้งานของคุณ
• ในการปรับ ระดับ เสียงของ แต่ละเสียง ให้ลากตัวเลื่อนใต้เสียง
• ในการปรับ ระดับเสียง ของ เสียงที่ใช้งานทั้งหมด ให้ลากตัวเลื่อนที่ด้านล่างของหน้าจอภายใต้ Sounds active:
• หากต้องการ หยุดเสียงทั้งหมด คลิก Stop all
• หากต้องการเข้าสู่ โหมดเต็มหน้าจอ ให้คลิก window icon ที่ด้านบนซ้ายของแถบไอคอน หากต้องการ ออก ให้คลิกไอคอนอีกครั้ง
• หากต้องการรับ เสียงแบบสุ่ม ให้คลิก arrow icon ในแถบไอคอน
• หากต้องการเปลี่ยน สีพื้นหลัง ของแอพให้คลิก gear icon ในแถบไอคอนและเลือกสี
• เพื่อให้ได้เสียง ผสมแบบสุ่ม ตาม อารมณ์ ของคุณให้คลิกที่ face icon ในแถบไอคอนและเลือกอารมณ์ของคุณ

- เรียกใช้การทดสอบ

ในการเรียกใช้การทดสอบให้เรียกใช้คำสั่งต่อไปนี้:

npm test

ในการตรวจสอบความครอบคลุมการทดสอบ (ขั้นต่ำที่ต้องการทั่วโลก 70%) ให้เรียกใช้คำสั่งต่อไปนี้:

npm test -- --coverage

เมื่อคำสั่งเรียกใช้ให้ค้นหาโฟลเดอร์ /coverage แล้ว /lcov-report และ index.html ในเบราว์เซอร์

โครงสร้างโครงการ

 .
├── components // All app components (MusicTiles, Shuffler, etc.)
├── constants // Enum of colors
├── contexts // Accessibility Context
├── data // Music list with corresponding image and mp3 sources
├── pages // The app
├── public // Audio and image files
├── styles // CSS file
└── utils // Fullscreen mode

- การบริจาค

โปรดอย่าลังเลที่จะเปิดปัญหาดึงคำขอและ Refactor/Fix! นี่คือโครงการที่มีชีวิตและยินดีต้อนรับความช่วยเหลือใด ๆ ขอบคุณ!

หากต้องการดูปัญหาปัจจุบันให้ตรวจสอบหน้าปัญหา

หากต้องการมีส่วนร่วมทำตามขั้นตอนด้านล่าง:

1. สร้างส้อมของ repo นี้
2. สร้างโฟลเดอร์บนอุปกรณ์ของคุณและโคลน repo forked ลงในนั้น

 git clone https://github.com/[YOUR-USERNAME-HERE]/lofi-music.git

3. สร้างสาขาคุณสมบัติ

 git checkout -b new-feature

4. กระทำการเปลี่ยนแปลงของคุณ

 git commit -m 'Added feature'

5. ผลักไปที่สาขา

 git push origin new-feature

6. ส่งคำขอดึง
   

ใบอนุญาต

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