magic web
1.0.0
Magic Web은 브라우저가 할 수있는 모든 놀라운 일을 발견하는 데 도움이되는 웹 앱입니다. 현재와 미래의 다른 표준 웹 API를 보여주는 일련의 작은 데모가 특징입니다. 아이디어는 사람들, 특히 개발자가 가능한 한 단일 장소에서 이러한 웹 API를 시험해 볼 수 있으며, 가능한 것을 이해 하고이 저장소의 코드를보고 그들이 어떻게 사용할 수 있는지 확인할 수 있다는 것입니다.
웹 앱은 React와 함께 빌드됩니다. 스타일은 일반 CSS로 작성되며 자동 설명서로 자동 접두사가 있습니다. Babel은 모듈 번들링을 위해 전송 및 웹 팩에 사용됩니다. React 앱 작성은이 모든 툴링을 처리하는 데 사용되었습니다. 모든 라우팅은 React 라우터를 사용하여 클라이언트 측면으로 처리되며 오프라인 지원을위한 서비스 작업자 코드는 SW-Precache로 자동으로 생성됩니다. 이 사이트는 GitHub 페이지에서 호스팅되며 간단한 NPM 스크립트를 통해 GH-PAGE의 명령 줄 유틸리티로 배포됩니다.
잘 설립 된부터 지리적 위치, 미디어 장치, 알림, 웹 음성, 웹 블루투스, 지불 요청 및 기타와 같은 최첨단에 이르기까지 여러 웹 API가 전시되어 앱 내에서 사용됩니다. 앱의 모든 데모에는 제목 아래에 포함 된 모든 웹 API가 나와 있습니다. Web API와 직접 관련된 모든 코드는 helpers 폴더 내부의 다른 모듈에서 격리되므로이를 살펴보기 위해 일반 JavaScript 외에는 아무것도 알아야합니다.
이 프로젝트는 제가 Front Fest 2017에 대화 제안을 제출 한 결과로 시작되었습니다. 최근 Chrome Dev Summit 2015의 Web Bluetooth 에서이 대화를 보았고 그에 의해 날아갔습니다. 또한 최근에 지불 요청 API에 대해 읽었으므로 대화에 대한 좋은 아이디어는 웹 플랫폼의 새롭고 덜 알려진 기능 중 일부를 선보이는 것이 좋습니다. 나의 제안은 받아 들여졌고, 그때 나는 내 대화를 나중에 자신의 스스로 러쉬 할 수있는 웹 앱의 형태로 라이브 데모로 내 대화를 바꾸는 것이 훨씬 더 흥미롭고 영향을 줄 것이라고 생각했을 때였 다.
웹 앱의 디자인은 재료 설계 지침을 따르려고합니다. 앱 전체에 사용 된 아이콘은 실제로 재료 아이콘 세트의 일부이며 로봇은 유일한 서체로 사용됩니다. 웹 앱의 이름과 기본 색상은이 GIF에서 영감을 얻었습니다.이 GIF는 최신 웹 API에 대해 처음 알게되었을 때 떠오른 이미지입니다.
React PWA Repository Create는 React App을 사용하여 구축 된 React 앱을 프로그레시브 웹 앱으로 전환하는 데 큰 도움이되었습니다. 또한 GitHub 페이지를 사용하여 클라이언트 측 라우팅을 만들기위한 GitHub 페이지의 단일 페이지 앱도 큰 도움이되었습니다.
웹 앱의 소스 코드는 MIT 라이센스에 따라 해제됩니다. 라이센스의 전체 텍스트는 라이센스 파일에서 제공됩니다. 이 프로젝트에 대한 오류가 있거나 제안이 있으면 문제를 열어 주시면 최선을 다해 도와 드리겠습니다.
