Web開発者におすすめのGitHubリポジトリ

リソースのリスト📚を手元に持っているのはいつでもいいことです。

コーダーとして、何度もボイラープレートのコードを書くよりも、機能性とベストプラクティスに焦点を当てることが求められます。冗長な努力を排除し、正しいツールを学んだり、私たちを大いに助けてくれる素晴らしいリソースについて知るために時間を投資しましょう。

この記事では、Web開発のスキルを大いに向上させ、より良いコードを書くのに役立ついくつかのGitHubリポジトリを紹介します。

このリポジトリは、Nodeの世界の最新情報を入手し、使いながらベストプラクティスについて学ぶのに素晴らしい場所です。4万スターを超え、133人のコントリビューターがいるこのリポジトリは、ほぼ毎日更新されます。

このリポジトリは、Node.jsのベストプラクティスやその他のツール(Docker、Kubernetesなど)との統合に関するトップランクのコンテンツのまとめであり策定です。現在、80以上のベストプラクティス、スタイルガイド、アーキテクチャのヒントがあります。

一般的なベストプラクティスには以下のようなものがあります -

  • プロジェクトの構造を改善する
  • エラーハンドリングの実践
  • コードスタイルの実践
  • テストおよび全体的な品質の実践
  • 本番環境への移行の実践 などなど。

このリポジトリをここでチェックしてください。

HTML5 Boilerplateは、迅速で頑丈、そして適応性があり、Webアプリケーションやサイトを構築するためのプロフェッショナルなフロントエンドテンプレートです。

このプロジェクトは、何年にもわたる反復的な開発とコミュニティの知識の産物です。特定の開発哲学やフレームワークを強制するものではないため、あなたが望む方法でコードをアーキテクトする自由があります。

定義済みの機能には以下のようなものがあります -

  • Normalize.css
  • CDNを使用したjQuery
  • Apacheサーバーの設定
  • 便利なCSSヘルパークラス
  • デフォルトの印刷スタイル、最適化されたパフォーマンスなど

使用したいものとその使用方法に応じて、そのフォルダの内容をプロジェクトディレクトリにコピーして貼り付ける必要があるかもしれません。これにより、開発時間を短縮するために既に事前に設定されたスターターテンプレートを提供してくれます。

このリポジトリをここでチェックしてください。

新しいフレームワークの核となる概念とイデオロギーをマスターすることは、不必要にイライラするものです。

ドキュメント📃の読み方、codepen上での作為的なサンプルの実行、サンプルアプリの分解と再構築、そしてローカルに彼らのCLIをインストールすることに至るまで、ただの多くの作業です。そして、概念が正しくない場合は同じくらいイライラするものです。

RealWorldは、任意のフロントエンド(React、Angular 2など)と任意のバックエンド(Node、Djangoなど)を選択し、両方を統合して実際のアプリケーション例を確認できるようにします。

これらの実装はスタック全体を担当するため、明らかに混在することはできませんが、それでも同じ機能とUXスペックに従います。

いくつかの人気のある統合には -

  • Angular + ngrx + nx
  • ClojureScript + re-frame
  • React / MobX
  • Go + Gin
  • NestJS + TypeORM/Prisma

があり、元のリポジトリでそれ以上に多くを見つけることができます。詳細は楽しんでチェックしてください!

Webだけでなく、モバイルの形式で利用できるというのもクールな点です。NativeScriptとして利用できます。

React Native、Jasonette、Swift、Xamarin上のC#、Kotlin/Android、Onymos、Quasarフレームワーク、Swift Perfect、Flutterは_進行中_です。

このリポジトリをここでチェックしてください。

これは、JavaScript言語の核となるメカニズムに深く潜る一連の書籍です。

これらの本はすべて無料で、リポジトリでオンラインで読むことができます。

著者による推奨される本の読み順は以下の通りです -

  • 始める
  • スコープ&クロージャ
  • オブジェクト&クラス(進行中)
  • タイプ&グラマー(進行中)
  • 同期&非同期(進行中)
  • ES.Next&ビヨンド(進行中)

このリポジトリをここでチェックしてください。

これは、Airbnbによる非常に正確でプロフェッショナルなスタイルガイドです。

このガイドは、基本から深く掘り下げてJavaScriptを理解するのに役立ち、途中でコードスニペットを使ってサポートします。

このスタイルガイドが取り上げる人気のあるトピックには、次のようなものがあります -

  • アロー関数
  • ホイスティング
  • 型キャスティング&強制
  • ECMAScript 6+(ES 2015+)スタイル
  • テスト
  • パフォーマンス

このリポジトリをここでチェックしてください。

Storybook 📖は、UIコンポーネントのための開発環境です。コンポーネントライブラリを閲覧し、各コンポーネントの異なる状態を表示し、インタラクティブにコンポーネントを開発してテストできます。

Storybookはアプリの外部で動作します。これにより、アプリ固有の依存関係を心配することなく、コンポーネントを隔離して開発できるため、コンポーネントの再利用、テスト可能性、開発速度が向上します。CLIといくつかのコードの例が付属しているため、Storybookに慣れることができます。

このリポジトリをここでチェックしてください。

Front-End Checklistは、ウェブサイトやHTMLページを本番環境に投入する前に持っているべき、またはテストするべきすべての要素の徹底的なリストです。

これは、Front-End Web Developmentに基づいたリポジトリで、パフォーマンス、セキュリティ、SEOなどにより重きを置いています。Front-End Checklistのすべてのアイテムは、ほとんどのプロジェクトに必要ですが、いくつかの要素は省略されるか、必須ではありません。

それには以下が含まれます -
📖: ドキュメントまたは記事
🛠: オンラインツール/テストツール
📹: メディアやビデオコンテンツ

このリポジトリをここでチェックしてください。

この記事は、Tech Sapienと彼の素晴らしい仕事に触発されて書かれました🔥。リポジトリの画像📷も同じソースから取られています。

それでは皆さん、ここまで読んでいただきありがとうございます。ここで紹介したリポジトリは、利用可能な唯一のリソースではありません。他にもたくさんの素晴らしいプロジェクトがあると確信しています。個人的にはこれらのリポジトリを非常に役立つものと見なし、よく自分自身で利用しています👨🏻‍💻。

これらすべての驚くべきリソースを作成するために努力をしてくれたすべての素晴らしいコントリビューターへの_感謝の印_として、これらのリポジトリに_星🌟を付けることを忘れないでください。それでは、平和を。✌🏼

こちらの記事はdev.toの良い記事を日本人向けに翻訳しています。
https://dev.to/sayanide/best-github-repos-for-web-developers-9id