フロントエンド開発で見逃せない 25 の Web サイトをお気に入りに追加してください。

開発者の作業を楽にしてくれる Web サイトはたくさんありますが、この記事では、開発者が必ず訪れるべきだと思うキラー Web サイトを 25 個紹介します。

1. DevDocs

https://devdocs.io/

DevDocs は、さまざまな言語、フレームワーク、ライブラリの API を 1 つの Web ページにまとめており、1 つのページ上で直接検索できます。

#2.ray.so

https://ray.so/

この Web サイトでは、コード スニペットの非常に美しいスクリーンショットを生成でき、ダーク モードとさまざまなプリセット言語テーマをサポートしています。 VSCode 拡張機能を使用することもできます。

3. Poet.so

https://poet.so/

この Web サイトは、Twitter、LinkedIn、Shopify の 3 つのソーシャル メディア Web サイトからの Web リンクに基づいて画像を生成できます。そして、非常に美しいスタイルとテーマを選択できます。

#4.roadmap.sh##https://roadmap.sh/

この Web サイトでは、開発者が参照できる学習パスと学習教材をいくつか提供しています。これは、特定の技術分野を学習したい初心者にとって非常に役立ちます。

5.LambdaTest

https://www.lambdatest.com/

LambdaTest は、クラウドベースのクロスブラウザー テスト プラットフォームです。アプリケーションをテストするために、最大 2,000 の異なるブラウザ、オペレーティング システム、デバイスが提供されます。これを使用して、アプリケーションのブラウザ互換性の問題を自動化または手動でテストできます。

6.daily.dev

https://app.daily.dev /

daily.dev Web サイトでは、毎日読むのに適した優れた技術記事を見つけることができます。この Web サイトには、さまざまなプラットフォームに関する優れた技術記事が集約されています。ブラウザ プラグインをインストールすると、高品質の技術コンテンツをブラウザに直接簡単に更新できます。

#7.ショーケース

https://www.showwcase.com/

Showwcase は、開発者、開発コミュニティ、仕事の機会を探している開発者に焦点を当てた新しいソーシャル メディアです。その設計コンセプトは LinkedIn に似ていますが、開発者の分野のみに焦点を当てています。

8. CSS-TRICKS

https://css-tricks.com /

この Web サイトでは、より美しい Web アプリケーションの開発に役立つさまざまな CSS テクニックを学ぶことができます。

#9. メデューサ

##https://www.medusajs.com Medusa は、オープンソースの Shopify の代替品です。 E2E 注文処理および製品管理インターフェイスを迅速に開発するのに役立ちます。重要なのは、メデューサは無料だということです。

10.SMARTMOCKUPS

https://smartmockups.com/ なぜ今でも Photoshop の学習に時間を費やしているのですか? Smartmockup は、アップロードした写真 (製品素材) に基づいて、Web ページ上で高解像度の製品テンプレートを直接生成できます (たとえば、T シャツ、ウォーターボトル、コンピューター画面に製品を表示します)。 Web ブラウザに基づいて、Smartmockup のプロフェッショナルなテンプレート素材は常に増加しており、デザイン経験がなくてもプロフェッショナルなテンプレートを入手できます。

11. コードの美しさ

https://codebeautify.org Web ページ上のコードを美しくすると、Web サイトには、開発者がよく使用する一連のツール (Web マスター ツールに似たもの) が提供されます。しかし、問題は、そのような Web サイトには多くの広告があることです...

#12.overAPI

##https://overapi.com/

開発者にとって、overAPI は間違いなく最も美しく実用的な Web サイトです。ほとんどの開発言語とツールの API を集約し、1 ページのメモの形で提示します。ぜひチェックしてみてください~

13. レスポンシブに

#https://sensitively 。 app/

オープンソースプロジェクトをベースにしたWebサイトで、様々なデバイスの画面を同一ページ上に表示できるため、レスポンシブなWebサイトを簡単に開発でき、フロント業務の効率が大幅に向上します。 -開発の効率化を完了します。

#14. カラーハント

https://colorhunt.co/

デザイナーや Web 開発者が優れた配色を選択できる Web サイト。

#15. カーボン

##https://carbon.now.sh/

ray.so と同様、この Web サイトもコード スニペットから画像を生成する機能を提供します。

#16. メタタグ

https://metatags.io/この Web サイトは、国際的な開発が必要なフロントエンドにとって非常に重要です。Google、Facebook、LinkedIn などの外国のソーシャル メディアでは、一連の

タグが提供されています。ページが対応する

タグで検出されると、これらのソーシャル メディアで Web ページを共有または表示するときに追加機能が提供されます。この Web サイトでは、これらの

タグを自動的に生成し、それらがさまざまなソーシャル メディアでどのように表示されるかを Web ページ上で直接プレビューできます。

17.

プロフィール写真メーカー https://pfpmaker.com/開発者として、さまざまなソーシャル メディア上の自分のアバターについて心配していますか?この Web サイトでは、アップロードした写真に基づいてアバターを自動的に生成できます。これらのアバターは AI によって処理され、背景が生成されています。試してみてください~

##18.開発ツール

https://smalldev.tools#この Web サイトでは、Base64 エンコード/トランスコーディング、コードの書式設定、画像圧縮、その他の機能など、開発者が一般的に使用する一連のツールを提供します。最も重要なことは、このウェブサイトは非常にすっきりしていて、広告がないということです。

#19.resume.io

https://resume.io/

#この Web サイトでは、高品質の履歴書を作成できます。優れたテンプレートを提供することで、プロフェッショナルな履歴書を作成するのに役立ちます。ぜひ試してみてください~

20. CODEPEN

https://codepen .io/

CodePen は、ユーザーが Web ページ上に HTML、CSS、JavaScript などのフロントエンド言語を記述できるようにする Web ベースの開発プラットフォームです。また、リアルタイムで表示されるため、トラブルシューティングが容易になります。開発者やデザイナーは、コード サンプルを世界の他の国々と交換することもできます。

21. ストーリーテイル

https://storytale.io/

Storytaleは、商用・個人利用可能なイラストを集めたサイトです（ダウンロードには会員登録が必要です）。イラストを合理的に使用すると、Web サイトの要素が充実するため、Web デザイナーやフロントエンド開発者にとって非常に役立ちます。

22.readme.so

https://readme.so/

この Web サイトでは、プロジェクトの README を非常に簡単に作成できます。 Web サイトが提供するシンプルなエディタを使用して、必要なモジュールを README にすばやく追加します。この Web サイトを使用すると、プロジェクトのドキュメントをすばやく作成できます。

#23.Peppertype

https://www.peppertype.ai

Peppertype は、コンテンツを迅速に作成および考案するのに役立つ Web サイトです。ビジネス、ブランド、対象ユーザーを分析し、機械学習と AI を使用して新鮮なコンテンツを作成します。

#24. シンセシア

https://www.synthesia.io/

Synthesia は、50 を超える言語で AI を活用したビデオを作成するのに役立ちます。ビデオ コンテンツの作成にカメラ、マイク、または実際の顔は必要ありません。スクリプトをアップロードするだけで AI ライブビデオが得られるので、顔を見せたくないビデオクリエイターに最適です。

#25. プログラマー ユーモア

https://programmerhumor.io/

この Web サイトでは、プログラミングや開発者のジョークがたくさん提供されています。娯楽として読むことができます~

元のアドレス: https:// juejin.cn/post/7077196404422246430

著者: Yihui

プログラミング関連の知識については、

プログラミング ビデオ

をご覧ください。 ！