Giter Club home page Giter Club logo

capstone-2023-04's Introduction

알고타 - 2023 캡스톤디자인 04조

1. 프로잭트 소개

22년 하반기 전장연의 시위로 인한 학생 및 직장인들의 대중교통, 특히 지하철 이용이 어려웠다.

지하철 실시간 도착 정보를 활용하여, 시민들이 지하철을 타고 이동하는 경로에 지연 정보를 알려준다면 어떨까?

해당 정보를 통해 지하철이 아닌 다른 방법으로 이동을 하면 시민들의 불편함을 줄일 수 있다고 생각해서 프로젝트를 기획했다.

During the second half of 2022, public transportation, especially subway services, were disrupted due to protests led by Jongjangyeon.

What if we utilize real-time subway arrival information to provide delay updates for commuters traveling by subway?

By providing this information, we can help citizens minimize their inconvenience by suggesting alternative modes of transportation instead of relying on the subway.

I planned this project because I believe it can reduce the inconvenience faced by students and employees.


2. 소개 영상

소개 영상

영상을 보시려면 사진을 눌러주세요.


3. 팀 소개

팀장 - 한국역사학과 천성규 (****0269)

팀원 - 임산생명공학과 김명찬 (****2026)


4. 사용법

메인 화면

처음 사이트에 접속했을 때 나오는 메인화면이다.

출발지와 도착지를 입력하여 길찾기를 할 수 있고, 현재 지연되고 있는 지하철 역에 대한 정보를 제공한다.

검색 화면

검색어를 입력하면 관련 검색어를 띄워준다.

리스트 중에서 원하는 곳을 누르면 해당 주소로 출발지 및 목적지를 지정할 수 있다.

결과 화면

출발지와 목적지를 입력하면 해당 경로까지 걸리는 시간을 보여준다.

capstone-2023-04's People

Contributors

github-classroom[bot] avatar mingtian-chan avatar mumat0103 avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

capstone-2023-04's Issues

기존 지도앱에 비해서 정확성을 어떻게 개선할 것인지.

정보를 제공하는 서비스의 특성상, 정확한 정보를 제공하지 못한다면,
가령 우리 프로젝트에서는 "지연정보" 를 제공하는 서비스인데, 이 지연정보가 정확하지 않다면 우리 서비스가 다른 서비스에 비해 나은 점이 없음.

서비스의 개선이 필요함.

지연정보 api 구현

  • 서울 교통 공사에서 제공하는 도시철도 지연 정보 api 가져오기
  • 직접 만든 api와 비교하기

크롤링 서버 구현

  • 장고에 연동
  • DB에 저장
  • POST API 구현
  • GET 요청 받으면 크롤링 -> 지연 정보 DB에 저장, 프론트로 던져준다.
  • 시리얼라이저 구현
  • 실행하기 전에 레코드 인스턴스 지우기
  • [ ]

메인 화면 새로고침 버튼 관련

  • 버튼 누르는 이벤트 비동기 처리로 바꾸기

  • 새로고침 버튼 누르면 한 번 누르면 로딩 완료 될 때 까지 로딩 모션 주기.

  • 네트워크 안 좋을 때 새로고침을 여러번 누르면 여러번 로드되는 에러가 있음.

Main Page

  • 5분 제한 로직 사용하기
  • 지연 정보 받아와서 TImeline 그리기
  • [ ]

시연 영상

테스트 케이스 기반으로 시연 영상 촬영
네이버 지도와의 차이점 확인
서버에 로그 찍히는 것 보여주기

추가 컴포넌트

  • 새로고침 버튼이랑 검색 버튼이랑 분리
  • 비활성화된 새로고침 버튼 필요

Pathindex component 백엔드 연결

  • 버스 정보를 받아오면 bus_index가 처리되어 bus_color가 정해집니다.
    백엔드에서 정보만 받아오면 됨.

const busColor = ["#f2b70a", "#0068b7", "#53b332", "#e60012"];

Appbutton 관련

  • 버튼 props에 color 속성(normal, hover, disabled) 추가해서 이벤트 처리하기 ( hovered, disabled )

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.