新人フロントエンドエンジニアの皆さんにとって、Web業界のトレンドの動きはとても早く、身に付けなければならない事もたくさんありますよね。それは理解していても、つい”日々の業務に追われ、勉強時間もなかなか確保できずに過ごしている”という方も多いのではないでしょうか?
今回はIT/Web業界での経験が豊富な先輩フロントエンドエンジニアの方々に向けて、「日々どのようなサイトをチェックしているのか?」というアンケートを実施しました。
新人はもちろん、ベテランの方も他のフロントエンドエンジニアが「どのように情報収集したり、トレンドを追っているのか」というのは、とても気になるところだと思います。
ぜひ最後までお読み頂き、気になるサイトがあればブックマークして今後のスキルアップにお役立てくださいね。
スキルアップにおすすめのプログラミングスクール【3選】
DMM WEBCAMP 学習コース | TechAcademy | COACHTECH(コーチテック) | 高い継続率を誇るオリジナルカリキュラム!転職・副業サポートが充実! | メンターは【全員が現役エンジニア!】コスパも良いので迷ったらここ | フリーランスエンジニア特化!オーダーメイドカリキュラムで挫折しない |
---|---|---|
169,800円(税込)〜 | 174,900円(税込)〜 | 440,000円(税込)〜 |
転職/副業サポートあり | 転職支援サービスあり | 案件保証サービスあり |
→ 無料相談 | → 無料体験 | → 無料カウンセリング |
転職したい方はこちら!
フロントエンドエンジニアに強い転職サイト・求人サイトを探すなら、「フロントエンドエンジニアの求人ならここ→おすすめ転職サイト9選!未経験OKあり」という記事がおすすめ。年収・キャリアアップはもちろん、未経験OKな求人を多数保有した転職・求人サイトを徹底的に比較できますよ!
目次
- 1 フロントエンドエンジニアがチェックするサイトとは?
- 1.1 女性/30代/情報・通信業
- 1.2 男性/30代/システム開発
- 1.3 男性/20代/Webサービス開発
- 1.4 女性/30代/ECサイト運営
- 1.5 女性/20代/広告業
- 1.6 男性/20代/デザイン事務所
- 1.7 女性/20代/学生
- 1.8 男性/40代/教育関連サービス
- 1.9 男性/30代/ゲーム開発
- 1.10 女性/20代/Webメディア運営
- 1.11 女性/30代/医療関連サービス企業
- 1.12 女性/40代/フリーランス
- 1.13 女性/20代/広告業
- 1.14 男性/20代/情報通信業
- 1.15 男性/30歳/地図制作業(デスクトップアプリ・業務アプリ開発者)
- 1.16 男性/30歳/フロントエンド(HTML,CSS,JavaScript,shopify)
- 1.17 男性/20歳/Webサービスのフロントサイドのコーディング
- 1.18 男性/30歳/情報サービス業
- 1.19 男性/25歳/フリーランスのコーダー
- 1.20 男性/28歳/制作会社のWebデベロッパー
- 1.21 男性/25歳/某有名Web系ベンチャー
- 1.22 男性/33歳/事業会社
- 1.23 男性/25歳/自社開発
- 1.24 男性/29歳/Webメディア運営会社
- 1.25 男性/26歳/介護系スタートアップの社内エンジニア
- 1.26 男性/28歳/受託系のシステム会社(フロントまわりがメイン)
- 1.27 女性/27歳/フリーランス
- 1.28 女性/29歳/制作会社
- 1.29 男性/25歳/Web制作会社
- 1.30 男性/51歳/フリーランス
- 1.31 女性/45歳/事業会社
- 1.32 男性/29歳/システム開発
- 1.33 男性/30歳/Web制作会社
- 1.34 男性/18歳/インターン
- 1.35 女性/32歳/フリーランス
- 1.36 男性/25歳/自社サービス会社
- 1.37 女性/24歳/IT系企業
- 1.38 男性/24歳/マーケティング支援サービス
- 1.39 男性/50歳/フリーランス
- 1.40 男性/53歳/フリーランス
- 1.41 男性/30歳/Web制作会社
- 1.42 女性/24歳/デザイン事務所
- 1.43 男性/21歳/システム開発会社
- 2 フロントエンドエンジニアに強い!おすすめ転職サイト・求人サイト
- 3 いきなりの転職が不安な方はプログラミングスクールという選択も
フロントエンドエンジニアがチェックするサイトとは?
《質問内容》
Q1. 性別を教えてください
Q2. 年代を教えて下さい
Q3. 現在の業種を教えてください
Q4. サイトのタイトル、URLと、そのサイトの「良いところ」や「チェックするポイント」などを教えてください
Q5. 今後身につけたい(興味のある)スキルや言語、知識などを教えてください
女性/30代/情報・通信業
MDN Web Docs
https://developer.mozilla.org/
“良いところ:
Web技術(HTML、CSS、JavaScriptなど)に関する公式ドキュメントが揃っている。
最新のブラウザ仕様や互換性情報が確認できる。
コード例が豊富で、基礎から応用まで分かりやすく学べる。
チェックするポイント:
新しいAPIやCSSプロパティの互換性を確認するために使用。
自分の書いたコードが仕様通りかどうか疑問に思ったとき、すぐに参照する。”
Stack Overflow
https://stackoverflow.com
“良いところ:
実際のエラーや疑問に対する具体的な質問と回答が多数ある。
世界中の開発者が使っているため、幅広い知見が得られる。
コード例や解決方法が実用的でわかりやすい。
チェックするポイント:
自分が直面しているエラーが他の人にも発生しているか検索。
回答の投票数が高いものを優先的に確認する。”
CodePen
https://codepen.io
“良いところ:
フロントエンドのアイデアを試したり共有できるプラットフォーム。
他のエンジニアが作成したデモやUIコンポーネントが豊富。
自分のアイデアを簡単に試してすぐに動作確認ができる。
チェックするポイント:
特定のUI/UXやアニメーションを実装する際の参考例を探す。
新しいCSS技術やフレームワークの実例を確認。”
CSS-Tricks
https://css-tricks.com
“良いところ:
CSSに特化したチュートリアルやテクニックが充実。
他の開発者の記事や最新情報を通じて学びやすい。
実践的なサンプルが豊富で、すぐに使えるヒントが多い。
チェックするポイント:
CSSグリッドやFlexboxの実用的な使い方を調べる。
アニメーションやレスポンシブデザインのアイデアを得る。”
Can I use
https://caniuse.com/
“良いところ:
HTML5、CSS3、JavaScriptの各機能のブラウザ対応状況が分かる。
サポートされていない機能を事前に把握できる。
新しい技術を採用するかどうかの判断材料になる。
チェックするポイント:
プロジェクトで使う技術がターゲットブラウザで動くか確認する。”
【今後身につけたいスキル】
C++,Python
【理由】
会社で使いそうだから
男性/30代/システム開発
React Native公式サイト
https://reactnative.dev/
“React Nativeの公式サイト。React Nativeとは、Reactを使ってモバイルアプリを開発できるフレームワークである。このサイトでは、React Nativeのインストール方法やドキュメント、チュートリアルなどが見られる。React Nativeの基本的な使い方や機能を学ぶのに最適なサイト”
React Native Elements
https://reactnativeelements.com/
“React NativeでUIコンポーネントを簡単に作れるようにするライブラリ。ボタンやカード、アイコン、フォームなどのコンポーネントが豊富に用意されており、簡単にインポートして使うことができる。このサイトでは、React Native Elementsの導入方法やドキュメント、デモなどが見られる”
Expo
https://expo.dev/
“React Nativeでモバイルアプリを開発するためのプラットフォーム。Expoを使えば、ネイティブコードを書かずにモバイルアプリを作成できる。また、Expo Goというアプリを使えば、自分のスマホで開発中のアプリをプレビューできる。このサイトでは、Expoのインストール方法やドキュメント、チュートリアルなどが見られる”
Awesome React Native
https://github.com/jondot/awesome-react-native
“React Nativeに関連する優れたリソースをまとめたGitHubリポジトリ。React Nativeの記事やチュートリアル、ライブラリやツール、サンプルアプリやテンプレートなどのリンクが掲載されている。React Nativeの学習や開発に役立つ多彩なリソースを見つけることができる”
React Native Directory
https://reactnative.directory/
“React Nativeのライブラリを検索できるサイト。カテゴリやタグで絞り込んで検索することができる。各ライブラリにはスター数やダウンロード数、互換性などの情報が表示される。React Nativeの開発に必要なライブラリを探すことができるサイト”
【今後身につけたいスキル】
React Native
【理由】
モバイルアプリの開発に興味があるため
男性/20代/Webサービス開発
CodePen
https://codepen.io/
“フロントエンドのコードをオンラインで編集・実行・共有できるサイト。デザインやアニメーションなどの作品を見ることができるので、インスピレーションを得ることができる。自分の作品も投稿できるので、フィードバックをもらうこともできる”
MDN Web Docs
https://developer.mozilla.org/ja/
“Web開発に関するドキュメントが充実しているサイト。HTMLやCSS、JavaScriptなどの基礎から、Web APIやフレームワークなどの応用まで、幅広く学ぶことができる。リファレンスやチュートリアルもわかりやすく書かれているので、よく参照している”
Frontend Masters
https://frontendmasters.com/
“フロントエンドのスキルを学ぶことができるオンライン教育サイト。著名なエンジニアが講師を務めるビデオコースが多数用意されている。最新のトピックやトレンドにも対応しているので、常にアップデートされた知識を得ることができる”
Smashing Magazine
https://www.smashingmagazine.com/
“Webデザインや開発に関する記事やニュースを配信しているサイト。デザインやユーザビリティ、パフォーマンスなどのテーマに沿って、実用的なアドバイスやベストプラクティスを紹介している。電子書籍やカンファレンスなどのコンテンツも提供している”
【今後身につけたいスキル】
react
【理由】
最新のフレームワークを学びたいから
女性/30代/ECサイト運営
CSS Tricks
https://css-tricks.com/
“CSSのテクニックやトリックを紹介しているサイト。レイアウトやアニメーションなどの実装方法や、CSSの最新動向やベストプラクティスなどを知ることができる。記事の内容は詳細で分かりやすく、コードのデモも見られるので参考になる”
JavaScript.info
https://javascript.info/
“JavaScriptの基礎から応用までを網羅したオンライン教材サイト。文法や構文、オブジェクト指向、非同期処理、DOM操作などのトピックが豊富で、各章には練習問題も用意されている。初心者から中級者まで幅広く学べるサイト”
freeCodeCamp
https://www.freecodecamp.org/
“フロントエンド開発に必要なスキルを学べるオンライン学習プラットフォーム。HTML / CSS / JavaScript / React / D3などのコースがあり、ビデオレッスンやインタラクティブなエクササイズ、プロジェクト課題などで学習できる。修了証も発行されるのでモチベーションにもなる”
Awwwards
https://www.awwwards.com/
“Webデザインの賞を授与するサイト。世界中のクリエイティブなWebサイトが紹介されており、デザインやユーザビリティ、コンテンツなどの評価が見られる。トレンドやインスピレーションを得ることができるサイト”
Can I use
https://caniuse.com/
“Web開発において、各ブラウザが対応している機能や仕様を調べることができるサイト。HTML / CSS / JavaScriptの機能や属性、APIなどを検索すれば、各ブラウザのバージョンごとの対応状況が表示される。クロスブラウザ対応に必須のサイト”
【今後身につけたいスキル】
TypeScript
【理由】
JavaScriptの型安全性を向上させたいから
女性/20代/広告業
Qiita
https://qiita.com/
“フロントに限らず様々な言語を表面的に理解することに有効なので活用しています。”
Twitter
https://twitter.com/
“サイトではありませんが、優秀なエンジニアが発信する内容は良質な情報が多いので、自分で様々なサイトでリサーチをする手間が省けるので活用しています。”
LIG
https://liginc.co.jp/
“技術に関する記事ではなく、WEB制作における仕事の進め方にフォーカスした記事も多く参考にしています。また、キャッチーな記事もあるので楽しませてもらっています。”
【今後身につけたいスキル】
Webマーケティング、コンサルティング
【理由】
企画、提案、実装までの一連の流れを全てカバーできるようになりたいから。
DMM WEBCAMP | ZeroPlus | Code Village |
---|---|---|
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます | JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます | WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです |
DMM WEBCAMPの評判・口コミ | ZeroPlusの評判・口コミ | Code Villageの評判・口コミ |
DMM WEBCAMPの公式サイトへ | ZeroPlusの公式サイトへ | Code Villageの公式サイトへ |
男性/20代/デザイン事務所
Vue.js公式サイト
https://jp.vuejs.org/
“Vue.jsの公式サイト。Vue.jsとは、ユーザーインターフェイスを構築するためのプログレッシブフレームワークである。このサイトでは、Vue.jsのインストール方法やドキュメント、チュートリアルなどが見られる。Vue.jsの基本的な使い方や機能を学ぶのに最適なサイト”
Vue Mastery
https://www.vuemastery.com/
“Vue.jsのオンライン学習プラットフォーム。Vue.jsの基礎から応用まで、さまざまなトピックやプロジェクトをビデオレッスンで学ぶことができる。Vue.jsの開発者やコミュニティのメンバーが講師を務めるコースが多数用意されている。無料で受講できるコースもある”
Vuetify
https://vuetifyjs.com/ja/
“Vue.jsでマテリアルデザインを実現するためのUIコンポーネントライブラリ。ボタンやカード、メニュー、ナビゲーションなどのコンポーネントが豊富に用意されており、簡単にインポートして使うことができる。このサイトでは、Vuetifyの導入方法やドキュメント、テーマなどが見られる”
Vue.js Examples
https://vuejsexamples.com/
“Vue.jsで作られたWebアプリやサイトの例を紹介するサイト。カテゴリやタグで絞り込んで検索することができる。各例にはスクリーンショットとデモ、ソースコードへのリンクが掲載されている。Vue.jsの実践的な使い方やアイデアを得ることができるサイト”
Vue Curated
https://curated.vuejs.org/
“Vue.jsに関連する優れたリソースを厳選して紹介するサイト。Vue.jsのコアチームやコミュニティのメンバーがカリキュレーターとなって、記事やチュートリアル、ライブラリやツールなどのリソースを評価している。Vue.jsの学習や開発に役立つ信頼できるリソースを見つけることができる”
【今後身につけたいスキル】
Vue.js
【理由】
Reactよりも簡単に使えると聞いたから
女性/20代/学生
YouTube
https://www.youtube.com/
“動画でプログラミングの基礎から応用まで学べるサイト。有名なエンジニアや教育者がチャンネルを開設しており、わかりやすく楽しく教えてくれる。自分の好きな動画を見つけて、コードを書きながら一緒に学べる”
Codecademy
https://www.codecademy.com/
“オンラインでプログラミングを学べるサイト。HTML / CSS / JavaScriptなどの基本的な言語から、React / Angular / Ruby on Railsなどのフレームワークやライブラリまで、幅広いコースが用意されている。インタラクティブなレッスンで、実際にコードを書いてフィードバックを受けられる”
CodePen Challenges
https://codepen.io/challenges/
“毎週テーマが発表されるコーディングチャレンジサイト。テーマに沿って自分の作品を作成し、CodePen上で投稿できる。他の人の作品も見ることができ、評価やコメントをもらえる。クリエイティブなアイデアや技術を競い合えるサイト”
CSS Zen Garden
http://www.csszengarden.com/
“同じHTMLの構造に対して、CSSだけでどのようにデザインを変えられるかを見せてくれるサイト。世界中のデザイナーやエンジニアが自分の作品を投稿しており、驚くほど多様なデザインが見られる。CSSの可能性や魅力を感じることができるサイト”
JavaScript30
https://javascript30.com/
“30日間で30個のJavaScriptのプロジェクトを作ることができるオンラインコース。フレームワークやライブラリを使わずに、純粋なJavaScriptだけで様々な機能やエフェクトを実装する方法を学べる。ビデオレッスンとスターターファイルが提供されており、無料で受講できる”
【今後身につけたいスキル】
なし
【理由】
***
男性/40代/教育関連サービス
JavaScript Weekly
https://javascriptweekly.com
“JavaScriptの最新情報やトレンドを毎週メールで配信してくれるサイト。記事やチュートリアル、ライブラリやツールなどの紹介があり、JavaScriptの動向をキャッチアップできる。メールの内容はサイト上でも見ることができる”
CodeSandbox
https://codesandbox.io/
“オンラインでコードを編集・実行・共有できるサイト。ReactやVueなどのフレームワークに対応しており、テンプレートから簡単にプロジェクトを作成できる。GitHubとの連携もできるので、コードの管理やデプロイも便利”
W3Schools
https://www.w3schools.com/
“Web開発に関する基本的な知識や技術を学べるサイト。HTMLやCSS、JavaScriptなどの文法や構文、タグや属性などのリファレンスが充実している。オンラインエディタでコードを試せたり、クイズや証明書も用意されている”
Web Design Museum
https://www.webdesignmuseum.org/
“Webデザインの歴史を紹介するサイト。1991年から2006年までのWebサイトのデザインやトレンドを見ることができる。当時の有名なサイトやブランドのサイトのスクリーンショットが掲載されており、Webデザインの変遷を感じることができる”
Web.dev
https://web.dev/
“Web開発に関する最新のベストプラクティスやガイドラインを提供するサイト。パフォーマンスやアクセシビリティ、セキュリティなどのテーマに沿って、Webサイトの品質を向上させるためのヒントやツールが紹介されている。自分のサイトの状態を測定したり、学習コースに参加したりもできる”
【今後身につけたいスキル】
GraphQL
【理由】
APIの開発を効率化したいから
男性/30代/ゲーム開発
Mozilla Developer Network
https://developer.mozilla.org/ja/docs/Web/API/WebGL_API
“WebGLの公式ドキュメントが提供されているサイト。WebGLの基本的な概念や使い方、チュートリアルやサンプルコードなどが充実している。WebGLに関する疑問や問題を解決するのに役立つ”
Three.js
https://threejs.org/
“WebGLを簡単に扱えるようにするJavaScriptライブラリ。3Dオブジェクトの作成や操作、アニメーションやカメラ、ライティングなどの機能が提供されている。ドキュメントやデモも豊富で、初心者でもWebGLの魅力を体験できる”
WebGL Fundamentals
https://webglfundamentals.org/
“WebGLの基礎から応用までを学べるオンライン教材サイト。WebGLの仕組みや原理、シェーダーの書き方、テクスチャやマトリックスなどのトピックが分かりやすく解説されている。オンラインエディタでコードを試したり、クイズに挑戦したりもできる”
Shadertoy
https://www.shadertoy.com/
“シェーダーをオンラインで作成・実行・共有できるサイト。シェーダーとは、グラフィックスの描画に関するプログラムのことで、WebGLでは重要な役割を果たす。このサイトでは、さまざまなシェーダーの作品を見ることができ、コードも閲覧・編集できる”
WebGL Samples
https://webglsamples.org/
“WebGLの高度な技術や機能を紹介するサイト。WebGLのパフォーマンスや品質を向上させる方法や、3Dモデルやテクスチャの最適化、ライティングやシャドウの効果などのテクニックが紹介されている。各サンプルにはコードと解説も付属している”
【今後身につけたいスキル】
WebGL
【理由】
ブラウザ上で3Dグラフィックスを描画できるようになりたい
DMM WEBCAMP | ZeroPlus | Code Village |
---|---|---|
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます | JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます | WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです |
DMM WEBCAMPの評判・口コミ | ZeroPlusの評判・口コミ | Code Villageの評判・口コミ |
DMM WEBCAMPの公式サイトへ | ZeroPlusの公式サイトへ | Code Villageの公式サイトへ |
女性/20代/Webメディア運営
HTML5 UP
https://html5up.net/
“HTML5とCSS3を使ったレスポンシブなWebサイトのテンプレートを無料で提供しているサイト。デザインが洗練されており、個人や企業のポートフォリオサイトなどに使える。ダウンロードして自分のサイトにカスタマイズできる”
Sass公式サイト
https://sass-lang.com/
“Sassの公式サイト。Sassとは、CSSの機能を拡張したプリプロセッサの一種で、変数やネスト、ミックスインなどの機能が使える。このサイトでは、Sassのインストール方法やドキュメント、チュートリアルなどが見られる”
Bootstrap
https://getbootstrap.com/
“Webサイトのデザインを簡単に作れるCSSフレームワーク。グリッドシステムやコンポーネント、ユーティリティなどが用意されており、レスポンシブやアクセシビリティにも対応している。このサイトでは、Bootstrapの導入方法やドキュメント、テーマなどが見られる”
CodePen Radio
https://blog.codepen.io/radio/
“Web開発に関する話題を扱うポッドキャスト。CodePenの開発者やデザイナーが出演し、Webデザインやフロントエンド開発のトレンドやヒント、仕事やキャリアに関する話などを聞くことができる。Web開発の最前線を知ることができる”
【今後身につけたいスキル】
Sass
【理由】
CSSの効率化と拡張性を高めたいから
女性/30代/医療関連サービス企業
Python公式サイト
https://www.python.org
“Pythonの公式サイト。Pythonとは、汎用性の高いプログラミング言語で、データ分析や機械学習などにもよく使われる。このサイトでは、Pythonのインストール方法やドキュメント、チュートリアルなどが見られる。Pythonの基本的な使い方や機能を学ぶのに最適なサイト”
Python入門
https://www.javadrive.jp/python/
“Pythonの入門者向けの学習サイト。Pythonの基礎から応用まで、さまざまなトピックが分かりやすく解説されている。変数や演算子、制御構造、関数、クラス、モジュールなどの基本的な内容から、ファイル操作や正規表現、GUIプログラミングなどの応用的な内容までカバーしている”
PythonistaCafe
https://www.pythonistacafe.com/
“Pythonの開発者や学習者が集まるオンラインコミュニティサイト。Pythonに関する質問や議論、情報交換などができる。Pythonの初心者からベテランまで、さまざまなレベルのメンバーが参加しており、フレンドリーで助け合いの精神がある。参加には招待状が必要で、有料のメンバーシップが必要”
Real Python
https://realpython.com/
“Pythonの実践的な学習サイト。Pythonの基礎から応用まで、ビデオレッスンや記事で学ぶことができる。データ分析や機械学習、Web開発やスクレイピングなどのトピックが豊富で、実際に動くプロジェクトを作りながらスキルを向上させることができる。一部のコンテンツは無料で利用できるが、全てのコンテンツにアクセスするには有料のメンバーシップが必要”
PyPI
https://pypi.org/
“Pythonのパッケージを検索・インストールできるサイト。Pythonのパッケージとは、Pythonで書かれたコードの集まりで、特定の機能やライブラリを提供するものである。このサイトでは、数万種類のパッケージを検索でき、pipというツールを使って簡単にインストールできる。Pythonの開発に必要なパッケージを探すことができるサイト”
【今後身につけたいスキル】
Python
【理由】
データ分析や機械学習に興味があるから
女性/40代/フリーランス
ICS MEDIA
https://ics.media
“昔からよく見ているブログのひとつで、初心者向けからベテランでも役に立つ小技まで幅広く掲載しているので、とりあえず眺めておけば「おっ」という情報に出会える。”
コリス
https://coliss.com
“どちらかというとデザイナー寄りの情報サイトではあるのだが、HTMLやCSSの情報が載っているのと、最近の流行りなど追えるのでチェックしている。フォントのSALE情報を掲載してくれているのが好き。”
JSer.info
https://jser.info
“Javascriptの最新情報が掲載されているので、使う人なら眺めておいて損はないと思います。”
CSS TRICS
https://css-tricks.com/
“実践的なコーディングの紹介や基礎的なことまで様々載っています。国内とはまた違う雰囲気なので暇な時に見ています。結構面白いです。”
【今後身につけたいスキル】
アプリ開発
【理由】
作って世に広めたいアプリがある
女性/20代/広告業
Qiita
https://qiita.com/
“フロントに限らず様々な言語を表面的に理解することに有効なので活用しています。”
Twitter
https://twitter.com/
“サイトではありませんが、優秀なエンジニアが発信する内容は良質な情報が多いので、自分で様々なサイトでリサーチをする手間が省けるので活用しています。”
LIG
https://liginc.co.jp/
“技術に関する記事ではなく、WEB制作における仕事の進め方にフォーカスした記事も多く参考にしています。また、キャッチーな記事もあるので楽しませてもらっています。”
【今後身につけたいスキル】
Webマーケティング、コンサルティング
【理由】
企画、提案、実装までの一連の流れを全てカバーできるようになりたいから。
男性/20代/情報通信業
https://developer.mozilla.org/ja/docs/Web
“HTML,CSSの仕様確認の際に頻繁に使用します。”
Can I use
https://caniuse.com/
“HTML,CSSの対応ブラウザの確認のために頻繁に使用します。”
Zenn
https://zenn.dev/
“技術・開発についての知見をシェアできます。本の販売や、読者からのバッジの受け取りなどの機能があり便利です。”
【今後身につけたいスキル】
UIデザイン
【理由】
市場価値を高めたいから
DMM WEBCAMP | ZeroPlus | Code Village |
---|---|---|
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます | JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます | WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです |
DMM WEBCAMPの評判・口コミ | ZeroPlusの評判・口コミ | Code Villageの評判・口コミ |
DMM WEBCAMPの公式サイトへ | ZeroPlusの公式サイトへ | Code Villageの公式サイトへ |
男性/30歳/地図制作業(デスクトップアプリ・業務アプリ開発者)
https://qiita.com/
“現場ベースで役に立つちょっとした情報が多いので、助けられることが多いです。”
jQueryリファレンス
http://semooh.jp/jquery/
“オプションなどを含めたjQueryの詳細仕様を把握したいときは便利です。”
ITMedia
https://www.itmedia.co.jp/
“自分がプライベートで開発したソースコードの管理に使っています。”
GitHub
https://github.com/
“技術系ニュースを幅広くキャッチアップするために使用しています。”
GitLab
https://about.gitlab.com/
“業務でのソースコード管理に使用しています。”
【今後身につけたいスキル】
React.js、AWSの運用スキル
男性/30歳/フロントエンド(HTML,CSS,JavaScript,shopify)
https://www.zzrock.net/
“アニメーションを作成したページが多くてこのサイトに着いてます”
stackoverflow
https://stackoverflow.com/
“難しいことがあればstackoverflowページに質問します。”
codepen
https://qiita.com/
“サンプルソースが多くて参加ができます。”
【今後身につけたいスキル】
Python, Liquid
男性/20歳/Webサービスのフロントサイドのコーディング
https://www.itmedia.co.jp/
“フロント系にこだわらず、幅広くITの知識や実例を知れるので活用しております。”
NewsPicks
https://newspicks.com/
“IT技術だけでなく、経済の動向や政治にまつわる情報などを収集する際に活用しております。”
Qiita
https://qiita.com/
“具体的にコードを記載して解説されているので、調べ物をする際に活用しています。”
【今後身につけたいスキル】
・Python
男性/30歳/情報サービス業
https://techfeed.io
“自分の興味のある分野のカテゴリーをフォローして、チャンネルとしてタイムラインに各カテゴリーの記事が表示されます。
新しい技術のキャッチアップに利用しています。”
Qiita
https://qiita.com
“ナレッジの投稿ももちろんしますが、使用している技術(フレームワーク、ライブラリ)の使い方を調べる際に投稿を見ることが多いです。”
CodeZine
http://codezine.jp
“最新技術の記事の投稿が多いので、気になる記事を見るとこちらのサイトが多くなります。”
【今後身につけたいスキル】
・Python
・サーバレス
・ローコード
男性/25歳/フリーランスのコーダー
https://shogo-log.com/
“初心者からWebエンジニアになるためのロードマップが分かりやすく、よく記事を拝見しております。初心者や中級者向けにブログが書かれているため、内容がわかりやすく、少しつまずいた時によく訪れています。自身の体験をもとに、ブログが書かれているため、実案件時にすごく参考になることがあります。”
フリーランスとセルフマネジメント
https://life-toshindai.com/
“こちらのサイトでは、主にWordPressでのサイト構築の方法を解説されています。WordPressでの簡単な操作方法から、初心者には理解しにくい内容のものまで分かりやすく解説されてあります。また、ブログだけで分からない場合は、YouTubeでの実際の動画を見ながらの解説もあるため、非常に分かりやすい内容のものとなっております。”
Codestep
https://code-step.com/coding-step/
“コーディングする際のテクニックが学べるので、スキル向上のため、こちらのサイトをよく利用しております。レベル別に模写コーディングができるため、自分のスキルがどの程度なものか、確認することもできています。そして、つまずいた際の解説も分かりやすいので、スキル向上には最適なサイトとなっていると思います。”
【今後身につけたいスキル】
・デザイン力
・Liquid
男性/28歳/制作会社のWebデベロッパー
https://zenn.dev/
技術に関する知見を投稿・シェアできるサイトです。Qiitaみたいな感じですが、教材を販売しているのが面白いです。
TechFeed
https://techfeed.io/categories/all
“海外の記事でもちゃんと翻訳されているので助かります。国内に限らず世界で話題になっているエンジニア向けの記事を読むことができます。”
メルカリエンジニアリングブログ
https://engineering.mercari.com/blog/
“メジャー企業のエンジニアさんが日々どのように課題解決してるかを知るのは、とても有益だと思います。”
【今後身につけたいスキル】
“Ract:UIのスキルアップをしたいから”
男性/25歳/某有名Web系ベンチャー
https://b.hatena.ne.jp/hotentry/it
“ド定番ではありますが、通勤中の電車の中などでサクッと今日一番のネタを仕入れるには良いです。”
クリーブ
https://creive.me/
“昔は面白い広告ネタなど結構ナナメな視点での記事が多かったですが、最近は技術系やマーケよりの記事も多いので結構チェックしています。”
IT Media
http://www.itmedia.co.jp/
“IT関連の最新ニュースを知るには欠かせないです。あと、ニッチな情報など切り口も幅広いので重宝しています。”
【今後身につけたいスキル】
営業力。フリーランスになりたいから。
男性/33歳/事業会社
http://jser.info/
“JSの最新情報を発信しているブログで更新頻度も高いのがオススメのポイントです。ライブラリに関してなんかも色々な情報を出してくれてます。”
Ferret
https://ferret-plus.com/
“会社が事業会社なので、マーケに関する知見はエンジニアといえど求められます。ので、頻繁にチェックするようにしています。”
ICS MEDIA
https://ics.media/
“社内でも見てるひと多いですね。フロントエンド周りの情報は充実しています。”
【今後身につけたいスキル】
Pythonです。自分でWebアプリを作ってリリースしてみたいから。
DMM WEBCAMP | ZeroPlus | Code Village |
---|---|---|
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます | JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます | WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです |
DMM WEBCAMPの評判・口コミ | ZeroPlusの評判・口コミ | Code Villageの評判・口コミ |
DMM WEBCAMPの公式サイトへ | ZeroPlusの公式サイトへ | Code Villageの公式サイトへ |
男性/25歳/自社開発
https://postd.cc/
“フロントエンドの技術というよりかは、国外でのエンジニア領域のトレンドやニュースなどを翻訳された状態で読むことができるので、知識の幅のためにもチェックしています。”
Developers.io
http://dev.classmethod.jp/
“技術系の記事の量が膨大かつ、ひとつひとつの記事がとても分かりやすくまとめられているので、お気に入りのサイトです。”
Thinkit
https://thinkit.co.jp/
“こちらも技術系では定番のサイトなので、かならずチェックします。更新も毎日されているので最新の情報なども収集しやすいです。”
【今後身につけたいスキル】
Kotlinを勉強中です。理由はJavaよりも開発しやすそうだから。
男性/29歳/Webメディア運営会社
https://blog.btrax.com/jp/
“デザイン会社運営のデザインに関する知識を発信するサイトです。エンジニアの方にもぜひ読んで頂きたいです。”
TechMe
https://techme.jp/
“サービスサイトですが、現役エンジニアにプログラミング関する質問や相談をビデオチャットで直接できます。”
メルカリエンジニアブログ
https://engineering.mercari.com/blog/
“超有名ベンチャーの企業ブログです。自社のプロダクトに関する課題やアイディアなどについて、とても興味深い情報を得ることができます。”
【今後身につけたいスキル】
PythonやR言語を使ったデータ分析をやってみたい
男性/26歳/介護系スタートアップの社内エンジニア
https://tech.recruit-mp.co.jp/
“技術解説がとても丁寧でわかりやすい。ニッチな情報も多いので朝礼でのネタに重宝している。”
best.of.js.org
https://bestof.js.org/
“JavaScriptの最新のバージョンが一括で確認できるのでとても便利。”
TechFeed
https://techfeed.io/main/realtime/now
“世界のフロントエンドの動向が追えます。(Web/フロントエンドというカテゴリがあります)”
ICS MEDIA
https://ics.media/
“解説内容のハードルが高くないので、初心者でもわかりやすいと思います。”
【今後身につけたいスキル】
Node.js、Express
男性/28歳/受託系のシステム会社(フロントまわりがメイン)
Parts.
https://partsdesign.net/
Webサイトをパーツごとにギャラリーとして紹介しているサイトです。ネタに困ったとき重宝しています。
ぽんひろ.com
https://ponhiro.com
WordPressで使えるCSSなどのTIPSが充実したブログです。サンプルもコピペで使えるのでとても便利です。
バズ部
https://lucy.ne.jp/bazubu/
クライアントへの提案をする機会も多く、ディレクションもやるので、SEOやマーケのネタをここで入手しています。
【今後身につけたいスキル】
Shopify:個人でECサイトを運営するのに色々とカスタマイズしたいから
女性/27歳/フリーランス
dotHTML5
https://dothtml5.com/
“技術やツールに関する様々な記事を毎日まとめて紹介してくれるので必ずチェックしています”
UX MILK
https://uxmilk.jp/
“海外のエンジニアが書いた記事を日本語訳にして配信してくれたりしているので助かります”
かちびと
http://kachibito.net/
“現場ですぐ使えるjqueryのソースコードを載せてくれているので、わからないことがあった時などとても便利です”
女性/29歳/制作会社
NxWorld
https://www.nxworld.net/ ※閉鎖されました
”コーディング周りで役立つ記事が多いので、何だかんだでこのサイトにたどり着いてます・笑”
HTML5Experts.jp
https://html5experts.jp/
”Webエンジニア向けの情報メディアです。フロントエンドに関する情報が盛りだくさんなので、必ずチェックします。”
サルワカ
https://ferret-plus.com/
”ボタンや見出しデザインなどのCSSを簡単にコピペ出来る。しかもサンプルも多いので急いでいる時にはかなり重宝しています。”
男性/25歳/Web制作会社
バシャログ。
http://bashalog.c-brains.jp/
“Web制作会社の技術ブログです。かゆいところに手が届くサイトです”
NxWorld
https://www.nxworld.net/ ※閉鎖されました
”デザインからコーディングTIPSまでWeb系の色々な情報が掲載されています”
webOpixel
https://www.webopixel.net/
”JavaScript・jQuery系の記事が多いので良くチェックしています”
男性/51歳/フリーランス
Twitter
https://mobile.twitter.com
“勉強会で発表された方などフォローしていて、つぶやかれる内容をWatchしている”
Qiita
https://qiita.com
“トレンド表示でいいねの多い順に並んでいるのでいつもチェックしている”
Frontend Focus
https://frontendfoc.us
“メール配信のニュースサイトを登録して毎週メールが届く。(英語)”
CSS Weekly
https://css-weekly.com
“メール配信のニュースサイトを登録して毎週メールが届く。(英語)”
JavaScript Weekly
https://javascriptweekly.com
“メール配信のニュースサイトを登録して毎週メールが届く。(英語)”
CodeGrid
https://www.codegrid.net
“フロントエンドの会社 PixelGrid が月に4回配信している有料ブログ。有料でも購読する価値のある内容。”
女性/45歳/事業会社
HTMLクイックリファレンス
http://www.htmq.com/
”老舗サイト。HTMLタグやCSSプロパティーについて、詳細な解説がなされているので、本当に助かります。”
Webクリエイターボックス
https://www.webcreatorbox.com/
”とにかく説明がわかりやすい。アイディアのヒントを得られたり、作業効率化の勉強になります。”
ferret Webマーケティングに強くなるメディア
https://ferret-plus.com/
”過去記事に、Wordpress関連のものがあったり、必ずしもマーケティングの記事とは限りません。クリエイターには参考になる話題が豊富。”
男性/29歳/システム開発
週間SVG
http://ssvvgg.net/ ※閉鎖
“SVGで困った際にチェックします”
Codrops
https://tympanus.net/codrops/
”ホバーの記事がよく掲載されているので参考にしています”
LIGブログ
https://liginc.co.jp/
”技術ブログが参考になるのでよくチェックします”
男性/30歳/Web制作会社
TAM のテクニカルチームがお届けする WEB技術ブログ!
https://www.tam-tam.co.jp/tipsnote/
わかりやすい解説と会社が地元
ジュンイチのブログ
https://junichi-manga.com/
SEOの情報が為になるため
株式会社LIG | 東京都台東区上野発のWeb制作会社、世界へ
https://liginc.co.jp/
専門外含め為になる情報が多い
男性/18歳/インターン
qiita
https://qiita.com/
IT関連の技術やネタが集まっておりメールなどのトピックを中心に読んでいる
teratail
https://teratail.com/
同じところで躓いている人がいる場合簡単に回答がわかるので読んでいる。BA以外の回答も参考になるので一通り目を通す。
とほほのwww入門
http://www.tohoho-web.com/
読みやすくきれいにまとまっており、CSSやHTMLの使用を確認したいときには必ず目を通す。
caniuse
https://caniuse.com/
クロスブラウザチェックの前に必ず目を通す。
女性/32歳/フリーランス
株式会社LIG
https://liginc.co.jp/
“デザインからフロントエンドやサーバーサイドまで記事が豊富です。
技術系やビジネス系以外の企画もおもしろいので、息抜きに見たりもします。”
WEBクリエイターボックス
https://www.webcreatorbox.com/
“デザイナーさんのブログなので、デザインの参考やUIの動きの参考などによく見ています。”
かちびと.net
http://kachibito.net/
“実装したいこと(例:アコーディオンメニューなど)で検索できるので便利です。
日々チェックするというよりも、実装したいことをWEB検索したときに検索結果としてヒットすることが多いです。”
寝ログ
https://nelog.jp/
“WordPressのカスタマイズをするときによく見ます。Simplicity2というWordPressテーマの作成者さんのブログです。
WordPressの管理画面のキャプチャやソースコードが掲載されているので、わかりやすいです。”
DMM WEBCAMP | ZeroPlus | Code Village |
---|---|---|
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます | JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます | WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです |
DMM WEBCAMPの評判・口コミ | ZeroPlusの評判・口コミ | Code Villageの評判・口コミ |
DMM WEBCAMPの公式サイトへ | ZeroPlusの公式サイトへ | Code Villageの公式サイトへ |
男性/25歳/自社サービス会社
GIGAZINE
https://gigazine.net/
“雑多なニュースが多いですが、脆弱性などの記事が多いため。”
3D人
https://3dnchu.com/
“CG系の技術がこれからも求められていくことが多いので、事前学習という形で眺めています。”
S5-Style
https://bm.s5-style.com/
“超有名なWebサイトギャラリーサイトです。デザインカンプを作る際には必ずチェックして、参考にしたり最新のテクニックやデザインのトレンドを参考にしています。”
女性/24歳/IT系企業
progate
https://prog-8.com/
“私がエンジニアになる際にとてもお世話になったサイトです。
時々初歩的な部分が曖昧になってしまったり、私の知識範囲外の仕事を頼まれた時にここで勉強しています。
とても分かりやすく、見た目も可愛いので、おすすめです。”
ドットインストール
https://dotinstall.com/
“弊社で法人契約しているサイトです。
動画を見ながら勉強できるのでとても重宝しています。”
CodeGrid
https://www.codegrid.net
“ピクセルグリッドが運営するサービス。有料ですがかなり有益な情報が得られます。”
web design trends
https://webdesign-trends.net/
“エンジニアではありますが、今流行のデザインなども抑えるべきだと思っているので、このサイトで流行のデザインなどもチェックしています。
プログラムを組む時に、どのようなデザインであればユーザが便利になるのか、今ユーザはどのようなデザインを欲しているのかが分かります。”
男性/24歳/マーケティング支援サービス
AtCoder
https://atcoder.jp/?lang=ja
“(他分野も込みで)日々の勉強に使用しています。課題形式なのが良いです。”
STUDIO
https://studio.design/ja
“ちょっとしたデザイン面を形にするのに使用しています。”
ferret
https://ferret-plus.com/
“業界のトレンドから初心者に向けて、記事やツールetcの紹介をしているwebメディアです。”
男性/50歳/フリーランス
Qiita
https://qiita.com/
“設定手順などが簡潔でわかりやすい。”
JSON Pretty Linter
https://lab.syncer.jp/Tool/JSON-Viewer/
“文法チェックが簡単にできる。”
ギャップロ
https://www.gaprot.jp/
“タイムリーな話題が豊富にある。”
Visual Studio Magazine
https://visualstudiomagazine.com/Home.aspx
“Visual Studio 関係の最新ニュースが読める。”
男性/53歳/フリーランス
zdNet Japan
https://developer.mozilla.org/ja/
“フロントエンジニアというよりもIT関連全般のニュースとして購読している。”
MDN web docs
https://developer.mozilla.org/ja/
“HTMLで思いだせないことがあったら調べている。”
Qiita
https://qiita.com
“他の人はこういう場合どうしているのか?気になったらチェックしている。知識を共有できるところが便利。”
男性/30歳/Web制作会社
Github Explore
https://github.com/explore
“オープンソースの最新情報が確認できる。最近トレンドのプロジェクト情報をいち早く仕入れるために見てます。”
JserInfo
https://jser.info/
“javascript、フロントエンド関連の最新ニュースが確認できるサイトです。とても重宝しています。”
Google Developers Web Update
https://developers.google.com/web/updates/
“Googleが公開しているWeb開発者向けの最新情報。Chromeの今後のリリース情報などを確認できる。”
女性/24歳/デザイン事務所
コリス
https://coliss.com/
“証拠や説明がはっきりとしていて画像もわかりやすい”
CSS-TRICKS
https://css-tricks.com/
“アプリケーションの動作の修正するための新しい構築の内容がわじゃりやすく書かれている”
ICS MEDIA
https://ics.media/
“いろんなサイトのデザインがきれいで記事の内容も濃い”
男性/21歳/システム開発会社
PHP研究所
https://www.php.co.jp/
“phpはとても使う言語などで常に勉強です。”
Qiita
https://qiita.com/
“エンジニアの知識を共有できるサイトで、知識が頭に入ります。”
Developers.io
https://dev.classmethod.jp/
“最近流行っているアプリ開発について学べます。分からなくても喋ることが出来ます。”
もう一度「【2025年】フロントエンドの皆さん!あなたが《日々チェックするサイト》を教えてください」を読む ↑
フロントエンドエンジニアに強い!おすすめ転職サイト・求人サイト
毎日忙しいフロントエンドエンジニアのみなさんが在職中でも気軽に、そして【最短】で理想の職場を見つけるためにおすすめの転職サイト・エージェントをご紹介します。
すべて無料で利用できるうえに、求人紹介から面接調整、条件交渉など面倒なことをフルサポートしてくれます。まずは気軽に無料相談で色々と質問してみると良いですよ!
年収UP率&面接通過率が高い!
レバテックキャリア
- キャリアアドバイザーがIT・Web業界に精通している
- 精度の高い企業別対策で書類選考の通過率UP
- 常時7,000件以上!求人数は業界トップクラス
専門用語が通じるIT/Web系に強いエージェント。徹底した企業研究で面接通過率が高い!
レバテックキャリア
面接対策やポートフォリオへの技術的なアドバイスもあり。専門的な知識が深いからマッチング率が高い!
20代、30代前半の転職に強い!
マイナビIT AGENT
※マイナビのプロモーションを含みます
- 国内最大級の求人数(8割が非公開求人)!
- 20代、30代向けのサポート対応が手厚い
- 有名ベンチャーやスタートアップなど他社には無い優良案件が多数
大手エージェントの強みを生かして豊富な求人の中から転職先を選べる!
マイナビIT AGENT
ベンチャー・スタートアップ系求人を多数保有。20代・30代のIT業界経験者へのサポートに定評あり。
未経験OKの求人を多数保有!
WORKPORT(ワークポート)
- 毎日新規求人が追加されるため非公開求人が豊富
- 転職のノウハウやIT知識・スキルを学べる無料セミナーが充実
- オリジナルの転職活動管理ツールで転職活動がスムーズに
IT、Web、ゲーム業界に特化!豊富な非公開求人と専門知識で転職をサポート!
ワークポート
未経験求人にも力を入れているので、スキル・経験に自身のない方もまずは登録しておきましょう。
もっと多くのフロントエンドエンジニアに強い転職サイト・求人サイトを探すなら、「フロントエンドエンジニアの求人ならここ→おすすめ転職サイト9選!未経験OKあり」という記事がおすすめ。年収・キャリアアップはもちろん、未経験OKな求人を多数保有した転職・求人サイトを徹底的に比較できますよ!
いきなりの転職が不安な方はプログラミングスクールという選択も
いきなり転職活動を開始する前に、「まずはプログラミング言語のスキルを身につけておきたい」。そう考える方には、プログラミングスクールの受講をおすすめします。
未経験・社会人でも安心して学習できるスクール、そして転職付き(転職保証型)のスクールなど、条件や目的によって選ぶ基準も様々だと思います。まずはじっくりと比較して、少しでも気になる教室があれば無料相談・体験会に申し込んでみると良いでしょう。
- DMM WEBCAMP 学習コース|フロントエンドコース
モダンなフロントエンド技術を使った、自分だけのWebサービスを公開できるレベルを目指せます - ZeroPlus(ゼロプラス)|Webデザインコース
JSやWebデザイン、WordPressなどフリーランスを目指せるスキルを網羅的に学習できます - Code Village(コードビレッジ)
WebサイトやWebアプリ開発を6ヶ月かけて学習。転職サポートに力を入れているスクールです - TechAcademy(テックアカデミー)|フロントエンドコース
完全オンラインの最大手スクール。コスパ良くフロントエンドの学習をするならここ - 本気のパソコン塾
jQuery、WordPress、PHP、Cake PHP、MySQLなど「クラウドソーシングでも稼ぎやすい」スキルを習得できます
未経験・社会人、学生におすすめなプログラミングスクールを比較するなら、「おすすめプログラミングスクール比較11選!社会人・未経験の転職・就職にも有利!」という記事を参考にしてください。
転職付き(転職保証型)のプログラミングスクールの詳細を知りたいかたは、「【無料あり】転職支援・保証型プログラミングスクール比較11選!社会人・学生さんの就職に強い!」をご覧いただき、自分の目標や目的にぴったりのスクールを見つけてくださいね。
学生におすすめのプログラミングスクールを比較するなら、「大学生におすすめのプログラミングスクール11選(安い+良質)!就職に強い!」を参考にしてください。スクールの選び方や就活に活かせるポイント、学割などお得な情報についても詳しく解説していますので、ぜひご覧くださいね。