みなさんこんにちは!おさかなです!
今回は「Web Skills」について、書いていこうと思います!
それでは、レッツゴー!!!!!
・Webスキルを上げたい方
・Web開発の勉強をしている方
・何から勉強すればいいのか迷っている方
最短ルートでスキルアップしたい!
![おさかな](https://osakanav.com/wp-content/uploads/2019/08/osakana.jpg)
Web開発の勉強をしたいけど、何から手を付けたら良いかわからないよ…💦
![ナビまる](https://osakanav.com/wp-content/uploads/2019/09/navmaru-2.jpg)
それなら「Web Skills」を覗いてみるといいかも!?
![おさかな](https://osakanav.com/wp-content/uploads/2019/08/osakana.jpg)
え!なにそれ〜!
![](https://osakanav.com/wp-content/uploads/2021/08/wappalyzer-top-160x90.jpg)
「Web Skills」って何?
「Web Skills」とはAndreas Mehlsenさんが作成した、ウェブ開発者が学ぶべきのスキルを「カテゴリ別」にまとめているサイトのことです。(いいね!)
スキルアップのために「何から学べばいいのかわからない!」という方や、「最短ルートで学びたい!」という方に役に立つサイトとなっております!(すごい!)
![](https://osakanav.com/wp-content/uploads/cocoon-resources/blog-card-cache/bc91d2ac40787e4bebe33e7b2630abf7.jpg)
![](https://osakanav.com/wp-content/uploads/2021/07/deep-javascript-160x90.jpg)
実際につかってみよう!
それでは早速サイトにアクセスします!
![](https://osakanav.com/wp-content/uploads/2021/10/web-skill.png)
ざーっと見てみると、こんな感じ!(わかりやすく、まとまってる✨)
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-scroll.gif)
カテゴリは全部で13つあります!
1 Fundamentals 基礎
2 Accessibility アクセシビリティ
3 Web components ウェブコンポーネント
4 Progressive webapps プログレッシブウェブアプリ(PWA)
5 Build tools ビルドツール
6 Frameworks & libraries フレームワーク & ライブラリ
7 Testing ソフトウェアテスト
8 Architecture & paradigms アーキテクチャ & パラダイム
9 Team collaboration チームコラボレーション
10 Design & ux デザイン & ユーザーエクスペリエンス(UX)
11 The modern web モダンウェブ
12 Algorithms & data-structures アルゴリズム & データ構造
13 Databases & servers データベース & サーバー
気になるカテゴリを見つけたら、横にスライドして内容をチェックしてみましょう!(よいしょっ!)
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-category.gif)
それぞれのスキルの「アイコン」にマウスカーソルを持ってくると、学習に役立つ「参考サイト」を紹介してくれます!(助かる〜)
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-link.png)
URLを開いてみると…?
めちゃくちゃ役に立ちそうなサイトばかり!
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-git-link.png)
![](https://osakanav.com/wp-content/uploads/cocoon-resources/blog-card-cache/a1a46d3f53526626bf83e88ca16a3218.png)
(これは良いね!!!)
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-githint.png)
右上のボタンを押すと、樹形図を解除することもできます!(これでも見やすい!)
![](https://osakanav.com/wp-content/uploads/2021/10/webskill-tree.gif)
GitHubでソースコードが公開されているので、興味のある方はぜひチェックしてみてください〜✨
![おさかな](https://osakanav.com/wp-content/uploads/2019/08/osakana.jpg)
最短ルートでスキルを身につけよう!
これで全ての操作は完了です。(やった~!)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました!
![](https://osakanav.com/wp-content/uploads/2021/06/switch-game-pg-top-160x90.jpg)