JavaScriptプロジェクト
このガイドは、実践的な学習体験を得るためにプロジェクトに取り組むことを目指している人々を対象としていますが、アイデアから外れています。 JavaScriptは非常に簡単に実装できます。あなたがする必要があるのは、コードをHTMLドキュメントに入れて、それがJavaScriptであることをブラウザに伝えることです。 Webユーザーのコンピューターで動作します。オフラインであり、サーバーが反応して別のページを表示するのを待つことなく、ユーザーエクスペリエンスを改善し、動的機能を提供する非常にレスポンシブなインターフェイスを作成できる場合でも。
初心者向けのプロジェクト
- Tic Tac Toeボードを作成します
- Webベースの計算機を作成します
- LocalStorage APIを使用して、持続するブラウザストレージを備えたTODOリストを作成します
- ユニットコンバーター（時間、距離、通貨など）を作成します
- オンラインゲームとしてのランダム迷路ジェネレーター
- Webベースのデジタル時計を作成します
- JSでCSS変数を更新します
- Canavas APIを使用してJSで蝶を変える空飛ぶ色を作ります。
- JSを使用してサウンドとキーボード入力を備えたWebベースのドラムを作成します
- 製品のカルーセルを作ります
- XOゲームを作成します。
- ピクセルエディターを作成します
- HTML、CSS、およびJavaScriptを使用して簡単なWebサイトを構築します
- 楽しいロボットステッカーを作成します
中級レベルのプロジェクト
- ランダムデータを使用して一般的なサインアップフィールドをオートフィルするスクリプトを作成する
- Yahoo！ Weather APIは、天気ウィジェットを構築します
- WebページにSoundCloudを統合して、ユーザーの気分に応じて曲を再生します
- Starwars-APIを使用して、すべてのキャラクターとその武器/車両のプロファイルを生成します
- Unsplash-APIを使用して、画像カルーセルを作成します
- Paper.jsを使用して、素晴らしいグラフィックを作成します。
- Parallaxjsを使用して、完全なページParallax bulerplatesを作成します
- フットボールデータAPIを使用して、無料のリーグのすべてのテーブルを取得できるWebページを作成します。
- 夜と昼間のスイッチャーを作成します
- TODOアプリを作成します
- ノートアプリを作成します
高度なレベルのプロジェクト
- NASAのGene Lab APIを使用して、インタラクティブな方法でデータを視覚化および表示するツールを構築する
- USGSのAPIを使用して、さまざまなフィルターを使用して地震のレガシーデータを視覚化します（大きさ、日付、影響を受ける領域、原産地）
- Google Map APIと世界銀行の気候データAPIを使用して、国、地域などによる歴史的な気候データを視覚化するインタラクティブツールを構築します。
- センチメント分析ライブラリの例とともにTwitterのAPIを使用して、有名人や政治家によるツイートを視覚化し、傾向を見つけます。
- 人生のゲームを構築します
- 株式市場をチャートします
- 投票アプリを構築します
インスピレーション
コードを使用した展開されたライブプロジェクトのコレクション。
- JavaScript Cloth SimulationTearable Cloth V2
- Fireworks Animation GeneratorFireworls in Canvas
- パフォーマンス粒子Animation30K粒子をキャンバスに作成します
- Cursordrawワームに基づくクールなランダムアニメーション
- 宇宙船シューターゲーム
貢献
- オープンソースが初めてで、プルリクエストを送信する方法がわからない人は、寄稿者を参照してください。mdファイルを参照してください。
