Tribhuvan University

Faculty of Humanities and Social Sciences

MUSIC STREAM WEB APPLICATION

A PROJECT REPORT

Submitted to
Department of Computer Application
Xavier International College

In partial fulfillment of the requirements for the Bachelors in Computer Application

Submitted by
Shibaa Adhikari
Sushma Chalise
2023

Under the Supervision of

Mr. Nirajan Shahi
 Tribhuvan University
Faculty of Humanities and Social Sciences
Xavier International College

Supervisor’s Recommendation

We recommend that the project titled "MUSIC STREAM WEB APPLICATION," prepared
under our supervision by Niranjan Shahi, in partial fulfillment of the requirements for the
degree of Bachelor of Computer Application, be considered for the final evaluation.

…………………….
Mr. Nirajan Shahi
Project Supervisor
Department of Computer Application
Xavier International College
Tusal,Kathmandu
 Tribhuvan University
Faculty of Humanities and Social Sciences
Xavier International College

LETTER OF APPROVAL

This is to certify that this project prepared by Shibaa Adhikari and Sushma Chalise entitled
“Music Streaming Web Application”in partial fulfillment of the requirements for the
degree of Bachelor in Computer Application has been evaluated. In our opinion it is
satisfactory in the scope and quality as a project for the required degree.

……………………………………... ………………………………………..
Mr. Nirajan Shahi Mr. Taisan Tamang
Project Supervisor Academic Manager
Department of Computer Application Department of Computer Application
Xavier International College Xavier International College
Tusal,Kathmandu Tusal,Kathmandu

……………………………………... …………………………………………..
Internal Examiner External Examiner
ABSTRACT
The "MUSIC STREAM WEB APPLICATION" is a dynamic online platform designed to
empower artists to share their music while offering users a personalized and engaging music
streaming experience. With a strong focus on promoting Nepali music, including Lokdhori
and various genres, the platform enables artists to easily upload and manage their songs,
while users can explore trending tracks tailored to their preferences.

Users can enhance their experience by adding songs to their favorites, selecting specific
features like genre, artist, or mood to curate playlists, fostering a sense of musical ownership
and discovery.

Developed using PostgreSQL, Node.js, Express, and React, the application ensures cross-
platform accessibility and a seamless user experience. React, in particular, offers advantages
in today's market with its component-based architecture, which streamlines development and
maintenance, enabling faster updates and improved user interface responsiveness, making it a
valuable addition to the world of online music streaming.

Music Stream Web Application seeks to provide a holistic platform for music enthusiasts,
artists, and fans of Nepali music. Its user-centric design and utilization of modern web
technologies make it a valuable addition to the digital music landscape.

i
ACKNOWLEDGEMENT
The success and ultimate outcome of this project were made possible thanks to the invaluable
guidance and support of numerous individuals. I am truly fortunate to have had their
assistance throughout this project, and I will always be grateful to them.

I want to extend my deepest gratitude to my supervisor, Mr. Nirajan Shahi, for his
unwavering guidance, continuous encouragement, and willingness to dedicate time from his
busy schedule to review the project's progress. His consistent inspiration played a pivotal role
in helping me complete this project and achieve its goals.

I would also like to express my heartfelt thanks to Mr. Vijay Yadav, Director of BCA, for his
valuable guidance, encouragement, and assistance in bringing this work to fruition. My
appreciation extends to my parents, who have consistently supported and encouraged me to
pursue my interests, guiding me on the right path.

Many individuals have contributed to my knowledge and experience throughout this project
and during the course. I sincerely thank all my friends for their unwavering support in
completing this project. Finally, I extend my special thanks to all the staff members of the
BCA department who, directly and indirectly, played a crucial role in making this project a
success.

ii
Table of Contents
ABSTRACT...............................................................................................................................................i
ACKNOWLEDGEMENT............................................................................................................................ii
LIST OF ABBREVIATIONS........................................................................................................................iv
LIST OF FIGURES.....................................................................................................................................v
LIST OF TABLES......................................................................................................................................vi
CHAPTER-1: INTRODUCTION.................................................................................................................1
1.1. Introduction................................................................................................................................1
1.2. Problem Statement.....................................................................................................................2
1.3. Objectives...................................................................................................................................2
1.4. Scope and Limitation..................................................................................................................3
1.5. Report Organization....................................................................................................................4
CHAPTER-2: BACKGROUND STUDY AND LITERATURE REVIEW..............................................................5
2.1. Background study.......................................................................................................................5
2.2. Literature Review........................................................................................................................6
CHAPTER-3: SYSTEM ANALYSIS AND DESIGN.........................................................................................7
3.1. System Analysis...........................................................................................................................7
3.1.1 Requirement Analysis...........................................................................................................7
3.1.2. Feasibility Analysis.............................................................................................................11
3.1.3. Data Modeling (ER-Diagram)..............................................................................................12
3.1.4. Process Modeling (DFD).....................................................................................................14
3.2.1. Architectural Design...........................................................................................................16
3.2.3. Database Schema Design...................................................................................................18
3.2.4. Flowchart...........................................................................................................................18
3.2.3. Interface Design.................................................................................................................19
CHAPTER- 4: IMPLEMENTATION AND TESTING...................................................................................24
4.1. Implementation........................................................................................................................24
4.1.1 Tools Used...........................................................................................................................24
4.2.1. Test Cases for Unit Testing.................................................................................................26
CHAPTER- 5: Conclusion and Future Recommendations.....................................................................31
5.1. Lesson Learnt/Outcome............................................................................................................31
5.2. Conclusion................................................................................................................................31

iii
LIST OF ABBREVIATIONS
CSS : Cascading Style Sheets
DFD : Data Flow diagram
ER : Entity Relationship
HTML : Hypertext Markup Language
ICT : Information and Communication Technology
IDE : Integrated Development Environment
SDLC : Software Development Life Cycle
SQL : Structured Query Language
UML : Unified Modeling Language

iv
LIST OF FIGURES
Figure 3.1.Use-Case Diagram of Artist for music stream web application
Figure 3.2. Use-Case Diagram of user for Music Stream Web Application
Figure 3.3. Gantt chart of Schedule for Music Stream Web Application
Figure 3.4. ER Diagram of Music Stream Web Application
Figure 3.5. Level 0 DFD for Music Stream Web Application
Figure 3.6. Level 1 DFD for Music Stream Web Application
Figure 3.7. Level 2 DFD for Music Stream Web Application
Figure 3.8. Architecture Design for Music Streaming Web Application
Figure 3.9. Sequence Design for Music Streaming Web Application
Figure 3.10. Database Schema Design for Music Streaming Web Application
Figure 3.11. Flowchart for Music Streaming Web Application
Figure 3.12. Signup Page for Music Streaming Web Application
Figure 3.13. Login Page for Music Streaming Web Application
Figure 3.14. Home Page for Music Streaming Web Application
Figure 3.15. Selecting Home Page Cards of Music Streaming Web Application
Figure 3.16. Features Page for Music Streaming Web Application
Figure 3.17. Selecting Features Page of Music Streaming Web Application
Figure 3.18. Trending Song Page of Music Streaming Web Application
Figure 3.19. Liked Song Page of Music Streaming Web ApplicationFigure
3.20. Admin upload song Page of Music Streaming Web Application
Figure 3.21. Edit song Page of Music Streaming Web Application

v
LIST OF TABLES
Table 4.1: Test case for Signup User
Table 4.2: Test case for Login User
Table 4.3: Test case for creating new album
Table 4.5: Test case for Remove Songs from Favorites
Table 4.4: Test case for Remove Songs from Favorites

vi
CHAPTER-1: INTRODUCTION
1.1. Introduction
Music streaming web applications have revolutionized the way people access and enjoy
music in the digital age. These platforms offer a convenient and accessible way to listen to a
vast library of songs and albums from various artists and genres. Music streaming services
have gained immense popularity due to their ease of use, extensive music catalogs, and
personalized features. Digital distribution of music began to achieve prominence in the late
1990s and early 2000s; MP3.com and PeopleSound were the first two platforms, and early
forerunners to platforms such as Spotify and Apple Music, offering the ability for musicians
(including, especially, independent musicians) to upload and distribute their songs online in
the MP3 format.[1]

The heart of our web app lies in its user-centric design. We offer dedicated sign-in and login
pages, catering to both artists and music enthusiasts. For artists, the process of uploading their
songs is seamless, enabling them to showcase their talent to a global audience. On the other
hand, users can easily explore, discover, and listen to music, creating a personalized music
journey that caters to their unique tastes. The ability to curate favorites and playlists enhances
this experience, allowing users to build a musical world that resonates with their soul.
Built using a cutting-edge technology stack, including React, Node.js, and CSS, our project
represents a synergy of modern innovation. It aims to bridge the gap between artists and
music lovers, offering a plethora of features and functionalities that cater to administrators,
artists, and passionate music enthusiasts alike.

The Music Stream Web Application is more than a platform; it's a portal to a world of
melodies, rhythms, and harmonies waiting to be discovered. Whether you're an artist looking
to shine on a global stage or a music enthusiast seeking the perfect tune for every moment,
our multifaceted approach to music streaming promises to elevate your experience, one
beautiful note at a time. Join us in this musical journey and unlock a world of endless
possibilities in the realm of music.

1
1.2. Problem Statement
In the context of the Nepalese music industry, several significant challenges and
transformations have emerged over the years. The industry, once thriving with annual
revenues exceeding four million US Dollars(Kasajoo 2008), has witnessed a notable shift.
The growth of the private sector within the music industry, beginning in the 1980s, led to the
immense popularity of commercial folk music, particularly 'lok dohori,' which found success
through CDs and Video CDs (VCDs). However, the dominance of these physical formats has
drastically declined in the past 15 years, with sales dropping from over 200,000 units
annually to just a few hundred. This decline has rendered the CD/VCD business nearly
obsolete within the Nepalese music industry. While revenue from YouTube is yet to make a
substantial impact, it holds promise as a potential income source in the future. In the pre-
digital technology era, the industry thrived on audio cassettes, CDs, and VCDs, employing
over 10,000 individuals directly and indirectly. (Nepali Banknews 2012)Today, cassette
production has nearly ceased, CD sales are plagued by duplicates and piracy, and the industry
faces a pressing need for innovative solutions to adapt to these changing dynamics and
reinvigorate its revenue streams. In light of these challenges and transformations, the
Nepalese music industry stands at a crossroads, facing the urgent need for digital innovation
and alternative revenue streams.

1.3. Objectives
Our music streaming web application aspires to fulfill multiple objectives within the context
of the Nepalese music industry. Firstly, it aims to bridge the technological gap highlighted by
“Executive IV of an indie record label, enabling Nepalese musicians to embrace digital tools,
distribute their music globally, and navigate the global digital network”. Secondly, the
platform seeks to unite the Nepali music community, providing a space where artists, singers,
and music enthusiasts can come together as one cohesive unit. This unity is crucial in
promoting collaboration, diversity, and the vibrancy of Nepal's music scene. Additionally,
our application endeavors to generate income for local artists and the broader music industry
through the promotion of Nepali music on streaming platforms, ensuring fair compensation
and recognition for their creative contributions. In essence, our platform's overarching goal is
to empower the Nepalese music industry with technology, foster unity, and create sustainable
income streams through Nepali music streaming platforms.

2
1.4. Scope and Limitation
The scope of the Music Stream Web Application is to create a comprehensive digital
platform that enables users to access a vast library of songs and music content through the
internet. The primary focus includes:
• Providing users with convenient and uninterrupted access to a diverse catalog of
songs, including both local and international music.
• Enhancing the user experience through features such as personalized playlists,
favorites, and curated song recommendations to encourage active engagement.
• Offering artists a platform to upload their music and connect with music enthusiasts,
fostering a vibrant music community.
• Leveraging technology to ensure efficient song discovery, seamless streaming, and
easy navigation for users.
• Regularly updating the music library with new releases and tracks to keep the
platform fresh and appealing.
• Ensuring that users can access the platform from anywhere, at any time, with
consideration for various levels of internet connectivity.

Limitations of the Music Stream Web Application:

• Users must have a stable internet connection to access and enjoy the music on the
platform, which may limit accessibility in areas with poor connectivity.
• The application may require users to be computer literate and comfortable with digital
technology, potentially excluding those with limited tech skills.
• The platform's reach may be limited to specific geographical regions, primarily
around areas where the service is available, potentially excluding users in remote
areas.
• The platform must navigate the complex landscape of music licensing and copyright,
which can impact the availability of certain songs or albums.
• The music streaming industry is highly competitive, with established players and new
entrants. Gaining and retaining a user base may pose challenges.
• Users may require compatible devices (smartphones, computers, tablets) to access the
platform, potentially excluding those with older or unsupported devices.

3
1.5. Report Organization
This document is categorized into several chapters and further is divided into sub chapters for
the proper organization of report including all details of the project.
First chapter is all about the introduction of the Project. It includes the proper introduction of
the music streaming web application in sub topic “Introduction”, problem of statement,
objectives, Scope and limitations as well as development methodology of the system.

The second chapter deals about the Background study of existing systems and Literature
Review of the system.

Third chapter contains the Requirement Analysis and System Design where functional and
nonfunctional requirements of the system are described by the helping of use case diagram of
admin as well as of user. Feasibility study as a sub topic is also included in this chapter where
technical, economical, operational feasibility are categorized as a sub topic of Feasibility
Study. In the same way, System Design is a sub topic which includes Object Modeling using
class diagram, dynamic modeling using state and sequence diagram and Process modeling
using activity diagram as well as details of algorithm used in the system.

The fourth chapter includes Implementation and testing parts where modules of system are
described and tools used in the system are listed out as Front End, Back End and
Documentation Tools. Under System testing, unit testing and system testing are tested for
successful system.

The fifth chapter includes Conclusion and Future Recommendations where sub topic
conclusion, outcomes and recommendations of project or system are described. After the
completion of the system, the proposed conclusion and outcomes are described on this
chapter. Similarly future recommendations are also described in this chapter.

4
 CHAPTER-2: BACKGROUND STUDY AND LITERATURE
REVIEW
2.1. Background study
Nepal, a country known for its rich cultural diversity and multilingual population, underwent
a significant transformation in its music landscape over the years. Historically, music was
confined to the palaces during the rule of the Shah Dynasty and the Rana regime, leaving the
general public without access to music. The launch of Radio Nepal in 1950 was a turning
point since it made music accessible to Nepalese citizens. The founding of the government-
backed Ratna Recording Corporation in the nation's capital, nevertheless, was the actual
turning point in the Nepalese music business. The Nepalese music scene underwent
significant changes as a result of this action.
Nepalese music became a business with the production of vinyl records by the state-owned
Ratna Recording Corporation. Following that, the audio cassette format was introduced. It
displaced vinyl and became a key source of revenue for the music industry until the late
2000s. When the CD was launched, it fully displaced audio cassettes. CDs are still the most
important legal music business in Nepal, and there are over a hundred studios in Nepal that
specialize in music recording and distribution (Subedi 2019).
The Nepalese music industry’s current business market is divided into three different genres:
commercial folk music (lok geet, Dohori geet) holds 50% of the market; modern songs
(adhunik geet) holds 25%; and the remaining 25% is shared by pop music and various
regional and linguistic songs (Nepali Banknews 2012).
In this market, Music Nepal stands as a towering figure, established in 1982 and currently
holding a significant share. Alongside, other dynamic music companies like Bindabasini
Music, Budha Subbha Music, Ranjana Music, SAC Music, Santana Records, and Rebel
Entertainment contribute to the industry's vitality. However, the advent of new digital
technologies has disrupted traditional revenue streams, with cassette and CD sales dwindling
due to piracy and duplication. This captivating narrative of Nepal's music industry
underscores the need for innovative solutions to bridge the gap between tradition and
digitalization, ensuring a harmonious future for Nepalese music.

5
2.2. Literature Review
Digital technology has significantly changed the whole music industry over the past 15 years.
The means and medium of music distribution have greatly benefited from the digital
revolution. In recent years, new digital technology has attracted a lot of attention and enabled
new digital business models. According to statistics, streaming revenues have increased by
34.0%, accounting for more than half (58.9%) of the global recorded music business, while
physical sales account for just under a quarter of the market, declining by 10.1% in 2018.
Music marketing has changed dramatically, and advances in technology have offered
numerous chances for music marketers to distribute and sell their products.
A wide range of models and licensed music services are being developed, offering customers
instant access to music. The music industry is always finding better and improved ways to
enhance its business by using technology. However, in the case of the Nepalese music
industry, it still employs the traditional business model and distributing channels for selling
music. The traditional business model distributes music using CDs, cassette tapes and other
physical recording.
From the interviews conducted with executives and stakeholders of different major, medium
and independent Nepalese record labels, six out of eight executives strongly recommend the
alternative business model to digitise and make Nepalese music available on international
platforms and the local market. Two express their preference to create an alliance and act as
leaders in the Nepalese music industry because they have a huge collection in their catalogue
and have access to global platforms. In contrast, six expressed their consent and seemed to
welcome an alternative digital music aggregator in the Nepalese music industry. One of the
executives says, ‘We are very positive about that [digital music business] opportunity. In fact,
we are looking for the kinds of possibilities where some new aggregator arrives and gives us
new hope and new possibilities. We are very positive for the new entrants’ (Executive III,
indie record label).
This literature review underscores the imperative for the Nepalese music industry to adapt to
the changing landscape of technology and digital distribution to thrive in the modern music
ecosystem.

6
CHAPTER-3: SYSTEM ANALYSIS AND DESIGN
3.1. System Analysis
3.1.1 Requirement Analysis
The requirement analysis for the Music Stream Web Application encompasses both
functional and non-functional aspects. Functional requirements define the specific operations
and functionalities to be performed by various actors within the system, including
administrators and users. Non-functional requirements, on the other hand, focus on aspects
such as system efficiency, performance, security, usability, and reliability. This
comprehensive analysis aids in understanding user needs, establishing project scope, and
assessing the resources and timelines required for successful completion. The two main
categories of requirements are detailed below:
i. Functional Requirements
Some of the functional requirements of Music Stream Web Application are listed below:
For Admin: -
 The system allows administrators to access a user-friendly sign-up and login interface.
 The system allows administrators to add new songs and music content to the platform.
 The system allows administrators to efficiently categorize music content.
 The system allows administrators to add other administrators for collaborative
management.

For Buyer: -
 The system allows users to access a well-organized music catalog, categorized by genres,
artists, and albums.
 The system allows users to create and manage personalized playlists.
 The system allows users to experience a seamless and intuitive interface for browsing and
discovering new music.
 The system allows users to easily view detailed information about songs, including title,
artist, album, and genre.
Use-Case Diagram:
The use-case diagram for the Music Stream Web Application illustrates the primary actors
and their interactions with the system. In this context, the primary actors are administrators
and music enthusiasts (users). Various use cases are associated with these actors, depicting
the functionalities they can perform within the system. These interactions and relationships

7
are visually represented in the use-case diagram to provide a clear overview of system
behavior and functionality.

Figure 3.1. Use-Case Diagram of Artist for music stream web application.

8
 Figure 3.2. Use-Case Diagram of user for Music Stream Web Application.

Actor Description
Name: Artist
Description: An artist is a musician or content creator responsible for uploading and
managing their music on the platform.
Name: User (Music Enthusiast)
Description: A user is an individual who visits the music streaming platform to discover,
listen to, and manage music content.
Use Case Description
Name: Manage Music Categories
Actors: Artist
Description: Artists can categorize their music into different genres and themes for efficient
management and easier user discovery..
Precondition:Music tracks and categorization details are available.

9
Flow of Event:
 Artist categorizes music into genres and themes.
 Artist can add or delete music categories.
 Users can easily explore and search music categories.
 Artist submits category details to the system.
 System records the information.
 Use case end.

Post Condition: Music categories are organized.

Name: Manage Music Tracks

Actors: Artist
Description:Artists can add, edit, or remove music tracks from the platform.
Precondition:Music tracks are available for management.
Flow of Event:
 Artist adds, edits, or deletes music tracks.
 System acknowledges
 Use case ends
Post Condition: Music tracks are updated.

Use Case Description

Name:Name: Create and Manage Favorites
Actors: User (Music Enthusiast)
Description:Users can create, edit, and delete personalized playlists to organize their favorite
songs.
Precondition:User has music tracks available.
Flow of Event:
 Users create, edit, or delete favorites song.
 Users add or remove songs from favorites song.
 Admin fills and submits the form to the system.
 System registers the details.
 Use case end.

Post Condition: User playlists are organized and updated.

10
These adapted actor descriptions and use-case descriptions align with the functionality and
interactions relevant to a Music Stream Web Application, focusing on the roles of artists and
music enthusiasts in managing and enjoying music content on the platform.
ii. Non-Functional Requirements
A non-functional requirement describes how the system performs a certain function. Non-
functional requirements generally specify the quality attributes or characteristics of the
system.
Some non-functional requirement of Music streaming web application is described below:
a) Performance:
The application provides low-latency, adaptive streaming with fast response times to
ensure uninterrupted and smooth music playback based on the user's internet connection.
b) Reliability

The application offers 24/7 availability and reliability, ensuring users can access it anytime,
anywhere, with built-in backup and redundancy mechanisms.
c) Scalability:

The system scales seamlessly to accommodate a growing number of users and songs while
maintaining optimal performance
d) Security:

Robust security measures are in place to protect user data, prevent unauthorized access, and
ensure the integrity of the service.
3.1.2. Feasibility Analysis
Feasibility analysis is a test of system according to its work ability, impact on the
organization, ability to meet user needs, and effective use of resources. The feasibility study
of this application had been carried out which are as follows:
i. Technical:
The development of the music streaming web application is technically feasible, leveraging
existing software technologies and development tools available in the industry. Standard
programming languages and frameworks can be used to build the application. The necessary
hardware infrastructure, such as web servers and database servers, can be readily procured or
hosted on cloud platforms.

ii. Operational:

11
The music streaming web application addresses the needs and preferences of users by
providing a platform for convenient and on-demand music streaming. It solves the problem of
users wanting access to a vast catalog of songs and personalized music recommendations,
aligning with the identified requirements.

iii. Economic:
The project is economically feasible, as it leverages readily available development tools and
open-source software components. Revenue generation through subscription models,
advertisements, or premium features is viable to sustain the application economically.

iv. Schedule:
The development of the music streaming web application can be implemented within the
planned schedule, ensuring timely delivery to users. A well-defined project timeline and
milestones are in place to guide the development process efficiently.

Figure 3.3. Gantt chart of Schedule for music streaming web application
3.1.3. Data Modeling (ER-Diagram)
A class diagram is a fundamental component in software design and modeling used to
visualize the structure of a software system. It provides a clear and concise representation of
the classes within the system, their attributes, methods, and relationships. In the context of a
music streaming application, a class diagram would depict key entities like users, songs,
playlists, and administrators, along with their interconnections. It serves as a valuable
blueprint for developers and stakeholders, facilitating the understanding and communication
of the system's architecture and functionality.

12
Figure 3.4. ER Diagram of Music Streaming Web Application

13
3.1.4. Process Modeling (DFD)
A Data Flow Diagram (DFD) for a Music Streaming Web Application can help illustrate
the flow of data and processes within the system. Below, I'll provide an overview of the
levels of DFD for a Music Streaming Web Application

1. Level 0 DFD

Figure 3.5. Level 0 DFD for Music Streaming Web Application

Level 0 of a Data Flow Diagram (DFD) provides a high-level overview of a system's

functionality, focusing on the major external entities and their interactions with the core
system. In the context of a music streaming app, Level 0 identifies two key entities: users
and admins. Users can log in, browse music, and manage their favorites, while admins can
upload, edit, and delete songs. The central system, represented as "MusicStreamingApp,"
serves as the main interface for both user and admin activities. Level 0 DFD doesn't delve
into the specific details of these interactions but provides a foundational understanding of
the system's components and primary user roles.

14
2. Level 1 DFD (User and Admin Interaction):

Figure 3.6. Level 1 DFD for Music Streaming Web Application

Level 1 DFD elaborates on the interactions between users and admins with the music
streaming app. It identifies three key processes: "Music Streaming," "Favorites
Management," and "Admin Panel Use." Users can use the app for music streaming,
browsing, and managing favorites, while admins can access the admin panel for content
management. This level provides a more detailed view of user and admin activities within
the system, building upon the high-level overview of Level 0.3. Level 2 DFD (Music
Streaming Process):

Figure 3.7. Level 2 DFD for Music Streaming Web Application

15
Level 2 DFD focuses on the "Music Streaming" process introduced in Level 1. It breaks
down this process into two sub-processes: "Search by Genre" and "View Trending Songs."
Users interact with the app by searching for songs by genre or viewing trending songs. This
level offers a deeper understanding of the user experience within the music streaming aspect
of the application, showing how users can explore and enjoy music.

3.2. System Design

In the context of our music streaming application, system design entails the detailed planning
of software components, data structures, and interactions. It ensures the application aligns
with both functional and non-functional requirements, guiding developers in its construction.

3.2.1. Architectural Design

Figure 3.8. Architecture Design for Music Streaming Web Application

The diagram visually illustrates the flow of data and requests, depicting how user requests are
initiated from the CLIENT, processed by the SERVER, and interact with the Database for
data retrieval and storage. This simplified architectural design serves as a foundational
framework upon which to build a more comprehensive and robust music streaming
application. It guides decisions related to technology choices, system behavior, scalability,
and security, ultimately ensuring the successful development and operation of the application.

16
3.2.2 Sequence Diagram

Figure 3.9. Sequence Design for Music Streaming Web Application

17
3.2.3. Database Schema Design

Figure 3.10. Database Schema Design for Music Streaming Web Application

3.2.4. Flowchart

Figure 3.11. Flowchart for Music Streaming Web Application

18
3.2.3. Interface Design

Figure 3.12. Signup Page for Music Streaming Web Application

Figure 3.13. Login Page for Music Streaming Web Application

19
 Figure 3.14. Home Page for Music Streaming Web Application

Figure 3.15. Selecting Home Page Cards of Music Streaming Web Application

20
 Figure 3.16. Features Page for Music Streaming Web Application

Figure 3.17. Selecting Features Page of Music Streaming Web Application

21
Figure 3.18. Trending Song Page of Music Streaming Web Application

Figure 3.19. Liked Song Page of Music Streaming Web Application

22
Figure 3.20. Admin upload song Page of Music Streaming Web Application

Figure 3.21. Edit song Page of Music Streaming Web Application

23
CHAPTER- 4: IMPLEMENTATION AND TESTING
4.1. Implementation
The implementation process is a crucial phase in the development of our music streaming
app. It involves coding and developing the software, ensuring that all functionalities are in
place. To ensure the success of this phase, we must focus on various critical factors, including
technology, integration, and training.
Defining Clear Objectives: I started by setting clear objectives for my music streaming app.
This meant outlining what the app should do and defining its purpose.
• Identifying Technical Needs: I identified the technical requirements, such as the
software, tools, and equipment needed to build the app.
• Creating a Project Plan: I created a detailed project plan, like drawing a map, to
guide me through the development process. This plan included all the steps and tasks
required.
• Designing and Testing: I worked on designing the app's user interface and
functionalities. Once the design was ready, I tested it rigorously to ensure it worked as
expected.
• Effective Communication: Throughout the project, I maintained open
communication with my team and other stakeholders. We discussed the project's
progress and ensured everyone was on the same page.
• Adaptability: I understood that things might not always go as planned. So, I
remained adaptable and made necessary adjustments to the project plan when faced
with unexpected challenges or changes.
• Problem-Solving: Whenever issues arose during development, I documented them,
tracked their progress, and actively sought solutions to address them.
4.1.1 Tools Used
• Frontend Tools
React: I utilized React as the core technology for building the frontend of my music
streaming application. React allowed me to create a dynamic and responsive user
interface by composing modular components.
Reactstrap: To enhance the styling and layout of the app, I integrated Reactstrap,
which is built on top of Bootstrap, into my React application. Reactstrap provided a
collection of pre-designed CSS components and styles, making it easier to develop a
visually appealing interface.
HTML: HTML was used for creating the various webpages and components within
the application. It played a fundamental role in structuring the content and layout of
the app.

24
 JavaScript: JavaScript was primarily used for client-side validation to ensure data
entered by users was accurate and valid. I employed JavaScript classes and functions
to implement this functionality.
CSS: CSS was crucial for controlling the visual appearance and styling of webpages
and content. It allowed me to define the layout, fonts, colors, and overall aesthetics of
the user interface.
Back-End Tools:
Node.js: I employed Node.js as the core technology for the back-end of my music
streaming application. Node.js provided a runtime environment for executing server-
side JavaScript code. It allowed me to build scalable and efficient server applications.
Express.js: To streamline the development of my back-end server, I utilized the
Express.js framework. Express.js is a minimal and flexible Node.js web application
framework that provides a set of robust features for building web and mobile
applications. It allowed me to define routes, handle requests, and manage middleware
efficiently.
PostgreSQL: As the database management system, I chose PostgreSQL. It played a
critical role in storing and managing data related to songs, users, playlists, and more.
PostgreSQL is known for its reliability and robust features, making it a suitable choice
for handling complex data structures.
4.1.2 Implementation Details of Modules
The modules used in Music Streaming Web Applications.
User Module (Listener Module):
• Allows users to create new accounts with a valid email and password.
• Registered users can log in to the system.
• Users can access the music library and view songs based on their interests.
• Users can see gerne wise songs.
• Users can rate songs, contributing to the music recommendation system.
• Users can save favorite songs.
Admin Module (Administrator Module):
• Administrators can log in to the system with valid credentials.
• Admins have the capability to manage music categories (genres, artists, albums).
• Admins can add new music categories and edit existing ones.
• Admins can view all available music tracks and albums.

25
Music Recommendation Module:
• This module suggests songs based on their popularity, determined by the highest
number of plays by other users.
• It utilizes the Merge Sort algorithm to efficiently arrange songs in descending order of
popularity.
• Songs are ranked so that those with the most plays by other users appear as the top
recommendations.
4.2.1. Test Cases for Unit Testing
Unit testing is the testing of every component of the system, every activity of the system. We
have tested each module of this system in order to check the correctness of the output. The
testing was successful through continuous testing and solving of the errors. In the unit testing,
we tested the login section by registering new users and providing access to use the system.
This in case of fail of expected result has been modified with source code.
Table 4.1: Test case for Signup User

Test Test Scenario Test Steps Input Test Expected Actual Result Pass/
ID Data Result Fail

1. Check user -Open the signup Username User should As expected, pass
registration with for. testuser12E be registered
vaild data. -Fill all the mail successfully,
required fields testuser123 and the
with valid data. @example.c response
-Click the signup om should
button Password contain an
strongPassw access token
ord123 and a refresh
Role: user token.

26
2 Check user -Open the signup Username User As excepted Fail
registration with form. testuser12E registration
incomplete data -Leave one or mail: should fail,
more required [Leave this and an error
fields empty. field empty] message
-Click the signup Password indicating
button. strongPassw the missing
ord123 field(s)
Role: user should be
displayed.

Table 4.2: Test case for Login User

Test Test Scenario Test Steps Input Test Expected Actual Result Pass
ID Data Result /
Fail
1. Check login with Open the login Username: User should As expected, pass
valid credentials form valid_userPa be logged in
Enter valid ssword: successfully,
username and valid_passw and the
password ord response
Click the login should
button contain an
access
token.

2 Check login with Open the login Username: User As excepted Fail
invalid password form valid_userPa registration
Enter a valid ssword: should fail,
username but an invalid_pass and an error
incorrect word message
password indicating
Click the login the missing
button field(s)
should be
displayed.

27
Table 4.3: Test case for creating new album
Test Test Test Steps Input Test Data Expected Actual Result Pass/
ID Scenario Result Fail

1. Create a new Send a POST Album title: "New The album As expected, pass
album with request to the Album" and songs
valid data create endpoint Album type: "Pop" should be
and songs with valid album Album artist: "Artist created
data and song files. Name" successfully,
Album year: 2023 and the
Songs data: An response
array of song objects should
with titles, featured contain the
artists, genres, and new album's
file paths. ID.

2 Create a new Send a POST Album title: User As excepted Fail

album with request to the "Incomplete Album" registration
incomplete create endpoint Album type: "Rock" should fail,
data with incomplete Album artist: [Leave and an error
album data. this field empty] message
Album year: 2022 indicating
Songs data: An the missing
array of song objects field(s)
with titles, featured should be
artists, genres, and displayed.
file paths.

Table 4.4: Test case for Adding Songs to Favorites

Test Test Scenario Test Steps Input Test Expected Actual Result Pass/
ID Data Result Fail

1. Add a song to Send a POST Username: The song As expected, pass

favorites with valid request to the "user123"So should be
create endpoint ng Title: added to the

28
 data with valid data "Favorite user's
including a Song" favorites,
username, song Song ID: and the
title, and song ID [Valid song response
ID] should
indicate a
successful
addition.
2 Add a song to Send a POST Username: The request As excepted Fail
favorites with request to the [Leave this should fail
missing username create endpoint field empty] with an error
with missing Song Title: message
username. "Another indicating
Favorite" the missing
Song ID: username.
[Valid song
ID]

Table 4.4: Test case for Remove Songs from Favorites

Test Test Scenario Test Steps Input Test Expected Actual Result Pass
ID Data Result /
Fail
1. Remove a song from Send a POST Username: The song As expected, pass
favorites with valid request to the "user789"So should be
data remove endpoint ng ID: removed
with a valid [Valid song from the
username and ID] user's
song ID. favorites,
and the
response
should
indicate a
successful
removal.

29
2 Remove a song from Send a POST Username: The request As excepted Fail
favorites with request to the [Leave this should fail
missing username remove endpoint field empty] with an error
with a missing Song ID: message
username. button [Valid song indicating
ID] the missing
username.

30
CHAPTER- 5: Conclusion and Future Recommendations
5.1. Lesson Learnt/Outcome
After the completion of the project, we are expecting the following outputs which will
minimize the problems as well as solve the existing problem.

• Users can create new accounts by providing their username, email, and password.
• Users can add songs to their favorites for quick access.
• Display a list of currently trending or popular songs on the platform.
• Users can explore songs by genre, making it easy to discover new music.
• Users can search for specific songs, artists, or albums using keywords.
• Play, pause, skip, and adjust the volume of songs being played.
• An administrative dashboard to manage users, songs, and playlists.

5.2. Conclusion
In conclusion, while there are established international music streaming platforms like
Spotify and Apple Music, our primary objective is to pioneer a dedicated music streaming
service tailored specifically for the Nepali market. Our vision extends beyond simply
providing a platform for music; it aims to foster the growth of the local music industry by
incorporating traditional Nepali songs and melodies.
This endeavor is driven by the desire to create a sustainable and vibrant music ecosystem
within Nepal. By curating and showcasing Nepali traditional music alongside contemporary
tunes, we aspire to connect audiences with their rich musical heritage while also supporting
local artists and creators.
In essence, our music streaming application is more than just a digital platform; it's a cultural
bridge that celebrates Nepal's musical diversity and contributes to the preservation and
evolution of its unique musical traditions. It's our commitment to the enrichment of the
Nepali music landscape and the empowerment of the local music industry.

31
5.3. Recommendation

In the dynamic realm of music streaming, future recommendations abound for platforms
seeking to elevate user experiences and expand their offerings. Prioritizing multilingual
support, including languages like Nepali, enhances accessibility and user engagement.
Facilitating song downloads for offline listening, introducing collaborative playlist creation,
and integrating social media sharing can further enrich the platform's appeal. Enhanced user
interactions through comments and reactions, precise song recommendations powered by
machine learning, and personalized homepages cater to individual tastes. Diversifying
content with live streaming and podcasts provides a holistic entertainment experience, while
high-resolution audio formats appeal to audiophiles. Empowering artists with data analytics,
promoting local talent, and adding geolocation-based features enhance the platform's cultural
relevance. Voice commands, virtual reality (VR) integration, cross-platform compatibility,
and accessibility features ensure inclusivity. User-curated radio stations foster engagement,
and collaborations with local content providers enrich the music library, collectively
contributing to a dynamic and culturally rich music streaming experience.

5.4. References
[Giri, Subash. (2021). Digital Technologies and Music Digitisation: Challenges and
Opportunities for the Nepalese Music Industry. International Journal of Business Research.
10. 1-12. 10.2478/ijmbr-2021-0005. ]
[Nepali Banknews. (2012) Economic Express (Nepali Music Industry), Capital Market
Research and Development Pvt. Ltd, Kathmandu]
[Kasajoo, V. (2008) “Communication Scenes Nepal”, in Asian Communication Handbook,
eds I. Banerjee & S. Logan, Asian Media Information and Communication Centre (AMIC)
and WKWSCI-NTU), Singapore, pp. 335-355]
[Subedi, G. (2019) “From Physical to Digital”. Available at http://ecs.com.np/features/from-
physical-to-digital (August 10, 2019)]
[Nepali Banknews. (2012) Economic Express (Nepali Music Industry), Capital Market
Research and Development Pvt. Ltd, Kathmandu]
[Eriksson, Maria, et al. Spotify teardown: Inside the black box of streaming music. Mit Press,
2019.]

32