Giter VIP home page Giter VIP logo

web-ide's Introduction

image

여러 사람이 실시간으로 협업하여 코드를 작성할 수 있는 웹 기반 통합 개발 환경(Web IDE) 입니다.

기성 Web IDE를 사용하여 온라인 협업 시 음성 채팅 기능이 없어
디스코드, Zoom 등 다른 플랫폼을 추가적으로 사용해야만 한다는 불편함을 해결하고자
음성 채팅 기술을 도입하였습니다.

기대효과

  • 생산성 향상
    동시에 여러 사용자가 작업을 할 수 있으므로 작업 속도가 빨라진다.
    코드 리뷰나 수정을 실시간으로 할 수 있어서 피드백 추가 주기가 단축된다.

  • 협업의 용이성
    팀원 간의 협업이 원활해지며, 실시간으로 코드를 공유하고 토의할 수 있다.

  • 교육 및 멘토링 효과
    신입 개발자나 학습자에게 실시간으로 가이드를 제공할 수 있어서 교육 효과가 증대된다.
    문제 상황을 실시간으로 공유하며 해결 방법을 찾을 수 있다.

📆 기간

2023.09.06 ~ 2023.10.11

🏃 팀 구성

Frontend

Backend

개발 프로세스

image

아키텍쳐

image

🔎 UI 및 기능

1. 회원가입 UI

signup.mp4

2. 로그인 UI

loginsuccess.mp4

3. 메인 UI

3-1. 컨테이너 사이드바 UI

default.mp4

3-2. 컨테이너 검색 기능

-.mp4

3-3. 컨테이너 삭제

default.mp4

3-4. 컨테이너 참여 유저 정보 UI

default.mp4

3-5. 컨테이너 시작

default.mp4

3-6. 컨테이너 고정, 링크 복사, 공개 비공개 전환

default.mp4

3-7. 컨테이너 소개 정보 수정

default.mp4

3-8. 컨테이너 정렬 기능

default.mp4

4. 컨테이너 생성 UI

container-success.mp4

5. 코드 편집 UI

5-1. 동시 편집

9-crdt.mp4

5-2. 탭 기능

7-tab.mp4

5-3. 파일 및 폴더 생성

1-file-add.mp4

5-4. 파일 및 폴더 삭제

6-folder-delete.mp4

5-5. 파일 및 폴더 이름 변경

3-name-modify.mp4

5.6. 채팅

11-chat.mp4

5-7. 음성 채팅

10-voice-chat.mp4

web-ide's People

Contributors

narcoker avatar dunowljj avatar dongjin113 avatar bstaran avatar stat1202 avatar jamesjoe0830 avatar hansera avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.