React - Node - Mongodb - Website for personal Karaoke UI
$250-750 CAD
S-au achitat serviciile după ce au fost prestate
Karaoke Website (node app) to host LOCALLY on a NODEJS server with npm.
REACT for front end
NODEJS for server-side
MONGODB for database.
I can test locally on webserver. Database URL should be specified somewhere clearly for easy editing.
A brief description of the database name and collections etc.
Attached images are a mock up of UI layout. Its not pretty or set in stone. Just a guideline of what would be ideal.
MAIN SITE
1. Main page should show first SONG FOLDER list in MAIN SONG LIST
2. “CURRENT QUEUE” panel is ALWAYS visible and live
3. SONG LISTS in all areas are DRAG and DROPPABLE which changes order (except singer history list)
4. Clicking on Different FOLDERS load that folders list of songs
5. Click ADD folder will prompt user to specify a LOCAL folder on the machine the browser is running in (not the nodejs server). The added folder will be scanned for local MP4 files in the format of <Artist> - <Song Name>.mp4
6. Each found mp4 should be added to the mongodb under collection “songs” with kv pairs for artist: <artist>
song: <song name>
duration: <duration>
folder_name: <friendly folder name>
mp4_path: <local full path to mp4> (used to actually play file later)
play_count: <amount of times played overall>
notes: <free text notes>
7. MAIN SONG LIST changes when different FOLDER is selected
8. MAIN SONG LIST has filters by artist and song name
9. MAIN SONG LIST has fields ARTIST - SONG - LENGTH - FILE PATH – NOTES (notes is a text field next to each song in the list. Text added here updates the SONG in the DB with the notes in the note: <notes> field
10. SONGS from MAIN SONG LIST can be dragged and dropped into Current QUEUE and is added to queue at dropped spot > Prompt for SINGER on DROP > type to filter from SINGERS COLLECTION in DB > ENTER with no filter results adds new singer
11. DOUBLE CLICKING song in MAIN SONG LIST has same behavior as above but adds to end of queue
12. SONGS from MAIN SONG LIST can be dragged and dropped into PUBLIC PLAYLISTS
CURRENT QUEUE
1. Dragging and dropping will change the QUEUE order
2. Play PAUSE and NEXT buttons change current playing behavior
3. RIGHT clicking on a song gives options
a. Remove From Queue
b. Move to NEXT (don’t stop current)
c. Play Immediately (stop current)
d. Pause QUEUE AFTER this SONG
4. Singer name editable in Queue
5. User should be able to “search” current queue with a filter box.. one or several that filters on Singer / Artist / Song Name
6. Dragging FROM queue to any playlist adds it to that playlist(DOESN’T remove from queue)
7. SHOW / HIDE video button will HIDE or SHOW second browser window playing the MP4 (the video should not be paused or interrupted using this button)
8. Current song time always shows live
9. Playing the Current QUEUE will auto SHOW and play MP4 file for song file path if not already.
SINGERS PAGE (singers collection in db)
1. Load list of singers as links in the bottom singers header
2. Selected singer shows THEIR custom playlists
3. Clicking on SONG FOLDERS while under SINGERS loads the song list in the MAIN middle area between SINGERS info and history
4. Singers HISTORY is draggable to CURRENT QUEUE and to SINGERS PLAYLISTS
5. SINGERS info are free text fields, edits will update the database
ID Proiect: #31816719
Detalii despre proiect
32 freelanceri plasează o ofertă medie de 575$ pentru proiect
Hello, I'm FullStack WebDeveloper with more than 6 years experience, my Stack: CMS: Joomla, Wordpress (build and managing extensions, build templates) FrameWorks: CodeIgniter, Laravel Template Systems: Blade, Twig, Sma Mai multe
Hello, Hope you're doing well. I am a professional Javascript(frontend) developer with 8+ years of experience in Javascript frameworks such as React, Angular, Vue and Bootstrap. I can start working immediately if you Mai multe
MERN Stack Developer is Here. Hello, William. I've just read your job description carefully and check out the attached files. So I'm very happy to find my skill in your project. I am an expert in React.js, React-redux, Mai multe
Yo!, I’ve carefully checked your requirements and really interested in this job. I’m full stack node.js developer working at large-scale apps as a lead developer with U.S. and European teams. I’m offering best quality Mai multe
Hi! I've just read your requirements of Karaoke project and I've seen your mock up images. I am an experienced and talented web developer with Full Stack of Skills. My main skills are MEAN and MERN stack. I am very in Mai multe
Hi client Thank you for your job posting. I am very interested in your project and I will provide you 100% quality work. My Main skill: React.js, Angular.js, Node.js, PHP, Laravel, Wordpress I am ready to start work i Mai multe
Thanks for your job posting I closely checked your description and mock up images I am sure that I can provide 100% perfect result in time I am professional web developer Development Experience : 7+ years from 2013 Fr Mai multe
Hi, With 5+ years of rich experience in react.js and node.js development, I am a senior expert. I am very familiar with MERN stack. So I can complete your project perfect. If you want the best developer, please contact Mai multe
Hi, there. Hope you are doing well. I went through your job description. I can help with that and can start right away. I have been working as a senior react developer for over 6+ years and have a ton of experience in Mai multe
i have already worked on similar projects many time . my 5 yr experience will help me to develop this . let chats and begin the development
Hello, How are you? I've read carefully your description. I have rich experiences with JavaScript/Node.js/Express JS/React.js/MERN. Your satisfaction with the project is my top priority! If you give me a chance to work Mai multe
Hello. I have read your requirements. I can develop so MODERN and BEAUTIFUL site for you. Using MERN stack. The site which is developed by MERN stack is much faster and modern than php site. I can work for you full tim Mai multe
Hi! This is Diana from Ukraine who has been working as an web & app developer for the last 6 years. I have checked the project description and I think that I can help you to do this project. I am fully feeling comfort Mai multe
Hello, sir. How's your day going? I've read your project notification carefully and sure I will perform it excellently. I have 5+ years of experiences in MERN stack. If you want, I can show you the project I built befo Mai multe
Hello client. I have just read your description carefully. I am sure I can do this perfectly. I can finish for an week. I can work full time for you. If you hire me, I cna start right now. Thanks
Hello we are two devolopers, I can do the backend and the other one is a frontend developer, we can deliver a great website in a fast time, we will use react, nodeks and MongoDB contact me to get started right now
Hello there :), I have ready your requirements. Piece of cake for me and I would love to help you. I would give you reasons why you should choose to work with me and in the end i'll share some website i've created. W Mai multe
We are a group of developers willing to carry out this long-range project, with highly scalable technologies, we have more than 7 years of experience working with the MERN stack.
