covid19_dashboard

이탈리아에서 Covid-19 Pandemic의 추세를 나타내는 크로스 플랫폼 (Android, iOS, Web) 대시 보드.

PWA URL

https://marinimau.github.io/covid19_dashboard/

스크린 샷

비디오 (iPad 2019, Safari, iOS 14 및 Dark Mode의 PWA)

https://youtu.be/71gjnxslzbk

특징

• 트렌드 표시 (다른 간격으로)
• 각 지역에 대한 전체 데이터 표현
• 지난 24 시간의 메모를 보여줍니다
• 시스템 테마를 기반으로 한 다크 모드
• 완전한 반응 형 webapp
• IOS 및 Android 앱은 기본 최적화로 렌더링됩니다

문제

• iOS에서 웹에서 실행될 때 Select Region Picker의 투명 텍스트 - 라이브러리에서 의존하여 솔루션을 찾았지만 "NPM 설치"후 라이브러리 코드를 편집해야합니다.
• 때로는 라인 차트 배경이 사파리에서 검은 색이거나 Firefox에 줄 그림자가 없습니다.

지침

1. 전 세계적으로 엑스포를 설치하십시오

npm install -g expo-cli

위의 명령에서 오류가 발생하면 Sudo를 사용하여 시도하십시오.

설치 한 후에는 일반적입니다.

zsh: command not found: expo

Expo-Cli를 실행하려고 할 때.

이 문제를 피하려면이 명령을 시작하십시오.

export PATH=$PATH:~/.npm-global/bin

2. Expo-Cli를 시작하십시오

프로젝트 경로로 이동하여 작성하십시오.

npm install

그리고 후

expo start

Metro Bundler 웹 페이지는 몇 초 만에 나타납니다.

3. 웹 앱을 시작하십시오

Metro Boundler 웹 페이지에서 'Web Browser에서 실행'을 클릭하십시오.

3. 모바일 앱을 사용해보십시오 (독립형을 구축하지 않고)

iOS 시뮬레이터가 설치된 경우 'iOS 시뮬레이터에서 실행'을 클릭하십시오.

1. 휴대 전화에서 엑스포를 다운로드하십시오 (App Store 또는 Play Store에서).

2. 엑스포를 시작한 컴퓨터의 동일한 네트워크에 전화기를 연결하십시오.

3. QR 코드를 스캔하십시오 (Android에서 Expo App Integrated Scanner를 사용하여 IOS의 경우 시스템 통합 스캐너를 사용하십시오).

기술

• 반응 신용
• d3.js
• 엑스포

데이터

원천:

https://github.com/pcm-dpc/COVID-19

실시간 업데이트.

저자

• 모로 마리니