Building a webrtc-based video call app

1. Portfolio Introduction

ETopic Co., Ltd. has successfully developed a multi-video communication service utilizing the latest WebRTC (Web Real-Time Communication) technology. This project provides video communication services between teachers and students and supports rating services for teachers after video calls. Additionally, it includes features that allow users to manage their profiles and communicate with each other through these profiles.

2. Scope of Work

The scope of work for this project includes:

1. Requirements Collection: Thorough analysis of customer requirements, followed by defining functions and creating storyboards based on these requirements.
2. Storyboard Creation: Visually representing the flow of the entire system and the detailed functions of each screen to facilitate smooth communication with the client.
3. Design: Developing user-friendly UI/UX designs to maximize user experience.
4. Publishing: Implementing a responsive website adhering to web standards using HTML5 and CSS3.
5. Frontend/Backend Development: Utilizing the latest technology stack to build stable and efficient frontend and backend systems.
6. Unit Testing and Third-Party Testing: Conducting thorough unit tests on each module and third-party tests to enhance the system's completeness.
7. User Testing: Identifying and improving issues in real-use environments through beta testing with actual users.
8. Release: Providing the service to the customer after passing all tests and formally releasing the product.

3. Key Features

Real-Time Video Communication with WebRTC:

• WebRTC is an HTML5-based web standard P2P communication technology that enables real-time video calls directly in the browser without additional plugins.
• Supports real-time video calls between teachers and students, offering a user experience similar to KakaoTalk's video call feature.

Push Notifications for Call Requests:

• When a call is requested, users receive real-time push notifications, allowing them to start video calls quickly and conveniently.

Profile Management and Communication:

• Both teachers and students can manage their individual profiles and communicate with each other through these profiles.
• After a video call, users can leave ratings for teachers, improving service quality and providing valuable feedback.

4. Technology Used

Server Configuration:

• Cafe24 Virtual Server Hosting: Utilized Cafe24's virtual server hosting for stable server operation.
• SMTP: Implemented email transmission functions using the SMTP protocol.
• IIS: Used IIS for web services on Windows servers.

Backend:

• PHP: Employed PHP as the server-side scripting language to implement backend logic.

Database:

• MariaDB: Used MariaDB for data storage and management. It is compatible with MySQL and is a highly performant and stable relational database.

Frontend:

• HTML5: Designed the webpage structure adhering to the latest HTML5 standards.
• CSS3: Implemented visually appealing and responsive web design using CSS3.
• JavaScript: Used JavaScript for dynamic client-side functionalities.
• jQuery: Leveraged the jQuery library to extend JavaScript functionalities and enhance code simplicity.
• Android (Cordova Framework): Developed the Android application using the Cordova framework to ensure compatibility with mobile platforms.

Conclusion

ETopic Co., Ltd.'s WebRTC-based video communication app development project aimed to provide users with convenient and stable video communication services utilizing the latest web technologies. Through this project, ETopic Co., Ltd. has demonstrated its expertise in real-time communication technology and will continue to strive to offer more innovative IT solutions in the future.