자바 스크립트 프로젝트
이 안내서는 실습 학습 경험을 얻기 위해 프로젝트를 수행하려는 사람들을위한 것입니다. JavaScript는 구현하기가 매우 쉽습니다. 코드를 HTML 문서에 넣고 브라우저에 JavaScript임을 알리기 만하면됩니다. 웹 사용자의 컴퓨터에서 작동합니다. 오프라인 상태 일 때에도 서버가 반응하고 다른 페이지를 표시 할 때까지 대기하지 않고도 사용자 경험을 향상시키고 동적 기능을 제공하는 응답 형 인터페이스를 만들 수 있습니다.
초보자를위한 프로젝트
- tic tac 발가락 보드를 만드십시오
- 웹 기반 계산기를 만듭니다
- LocalStorage API를 사용하여 지속적인 브라우저 스토리지로 TODO 목록 작성
- 단위 변환기 (시간, 거리, 통화 등)를 만듭니다.
- 온라인 게임으로 임의의 미로 생성기
- 웹 기반 디지털 시계를 만듭니다
- JS로 CSS 변수를 업데이트하십시오
- Canavas API를 사용하여 JS로 날아 다니는 색상의 나비를 만드십시오.
- JS를 사용하여 사운드 및 키보드 입력으로 웹 기반 드럼을 만듭니다.
- 제품 회전 목마를 만드십시오
- XO 게임을 만드십시오.
- 픽셀 편집기를 만듭니다
- HTML, CSS 및 JavaScript를 사용하여 간단한 웹 사이트를 구축하십시오
- 재미있는 로봇 스티커를 만듭니다
중간 수준 프로젝트
- 임의 데이터를 사용하여 공통 가입 필드를 자동으로 통제하는 스크립트를 만듭니다.
- 야후! yahoo! 날씨 위젯을 구축하는 날씨 API
- 사용자의 분위기에 따라 노래를 재생하기 위해 웹 페이지의 SoundCloud를 통합합니다.
- Starwars-Api를 사용하여 모든 캐릭터와 무기/차량의 프로필을 생성하십시오.
- Unsplash-Api를 사용하여 이미지 회전 목마를 만듭니다
- Paper.js를 사용하여 놀라운 그래픽을 만듭니다.
- agnalaxjs를 사용하여 전체 페이지 시차 보일러 플레이트를 만듭니다
- Football Data API를 사용하여 무료 리그의 모든 테이블을 검색 할 수있는 웹 페이지를 작성하십시오.
- 야간과 낮 스위처를 만듭니다
- TODO 앱을 만듭니다
- 메모 앱을 만듭니다
고급 레벨 프로젝트
- NASA의 Gene Lab API를 사용하여 대화식 방식으로 데이터를 시각화하고 표시하는 도구를 구축하십시오.
- USGS의 API를 사용하여 다양한 필터 (크기, 날짜, 영향을받는 영역, 원산지)로 지진의 레거시 데이터를 시각화하십시오.
- Google Map API 및 World Bank의 기후 데이터 API를 사용하여 국가, 지역 등의 역사적 기후 데이터를 시각화하는 대화식 도구를 구축하십시오.
- 감정 분석 라이브러리 예제와 함께 트위터의 API를 사용하여 유명인과 정치인의 트윗을 시각화하고 트렌드를 찾으십시오.
- 삶의 게임을 구축하십시오
- 주식 시장을 차트
- 투표 앱을 구축하십시오
영감
코드가 포함 된 배포 된 라이브 프로젝트 모음.
- JavaScript 천 시뮬레이션 용기 v2
- 캔버스의 불꽃 놀이 애니메이션 발전기 파이어
- 캔버스에서 성능 입자 애니메이션 30K 입자 생성
- Cursordraw Worm을 기반으로 한 멋진 임의의 애니메이션
- 우주선 사수 게임
기여
- 오픈 소스를 처음 접하고 풀 요청을 보내는 방법을 모르는 사람들은 Contributing.md 파일을 참조하십시오.
