Closed8

Full Stack Developer Roadmap に沿ってスキルをチェックしてみる

ピン留めされたアイテム
PoorStackPoorStack

まとめ

React と DevOps の CI/CD や IaC 周りが弱いことがわかったので、ロードマップに従ってサンプルプロジェクトを作りながら基礎をしっかり習得しておきたい。

PoorStackPoorStack

現状のフルスタック力をチェックしてみたい。

https://roadmap.sh/full-stack

フルスタック開発とは、ウェブアプリケーション開発のフロントエンドとバックエンドの両方の側面に精通することです。フルスタック開発者は、ユーザーインターフェイスやユーザーエクスペリエンス(フロントエンド)からサーバー、データベース、サーバーサイドロジック(バックエンド)まで、ソフトウェアアプリケーションのすべてのレイヤーで作業することができます。この多様性により、単独で、または開発チームの一員として、完全なウェブアプリケーションを作成し、維持することができます。

このロードマップの対象読者は、フルスタック開発に参入したい全くの初心者である。

PoorStackPoorStack

このあたりのスキルは余裕であった。

🚩 = Checkpoint

  • HTML
  • CSS
  • 🚩 静的ウェブサイト制作
  • JavaScript
  • 🚩 インタラクティブ機能の実装
  • npm
  • 🚩 外部パッケージの利用
  • Git
  • GitHub
  • 🚩 GitHubでの共同作業
PoorStackPoorStack

GitHub プロファイルの推奨事項

  • リポジトリ名は小文字にし、単語の区切りにはハイフンを使いましょう(例:TodoApp や Todo-App ではなく todo-app)。
  • 作成した各リポジトリに README.md ファイルを追加します。このファイルにはプロジェクトの説明を書いてください。READMEに力を入れ、プロジェクトがどのようなものか、誰でもローカルで実行できる方法について、明確に詳しく書いてください。
  • プロジェクトのスナップショットを readme ファイルに追加して、ローカルで実行しなくても、誰でもプロジェクトがどのようなものかわかるようにしましょう。
  • 作成した各リポジトリに LICENSE ファイルを追加します。このファイルには、プロジェクトに使用するライセンスを記述します。ライセンスの選択にchoosealicense.comを使うことができます。
PoorStackPoorStack

React が色々弱かった。

  • Tailwind
  • React (一部未習得)
    • CLI Tools
    • コンポーネント
      • 高階コンポーネント (未経験)
    • レンダリング
    • Hooks (なんとなく使っているだけ)
    • Routers (未経験)
    • 状態管理
    • Styling (CSS-in-JS を未経験)
    • API Calls (React + GraphQL, react-query が未経験)
    • Testing (E2Eテストを未経験)
    • フレムワーク (Next.js)
    • Forms (未経験)
    • Advanced Topics (すべて未経験)
    • Mobile (React Native)
PoorStackPoorStack

この時点で、あなたは以下を含む完全なフロントエンド・アプリケーションを構築できるはずです:

  • HTMLによるウェブページの構造化
  • CSSでウェブページをスタイリングする
  • JavaScript を使ってウェブページにインタラクティブ性を追加する
  • DOM API を使ってウェブページを操作する
  • Fetch API を使って HTTP リクエストを行う
  • プロミスを理解し、async/await 構文を使って非同期コードを書く
  • npm を使った外部ライブラリのインストールと使用
  • Git によるコードのバージョン管理
  • コードをGitHubにプッシュする

ReactとTailwindをスキップすることに決めたのであれば、それはそれで構わないが、HTML、CSS、JavaScriptを使った完全なフロントエンド・アプリケーションを作ることはできるはずだ。しかし、最新のフロントエンド・アプリケーションは、React、Vue、Angularといったフレームワークで構築されることがほとんどだということを覚えておいてほしい。そのため、どの時点でも少なくとも1つは学ぶ必要がある。

これでフロントエンドの基礎は終わりです。バックエンドの開発を続ける一方で、フロントエンドの開発にはもっと多くのことがあることを知っておいてください。そして、あなたの旅の後半でfrontend roadmapをチェックアウトすることを忘れないでください。

PoorStackPoorStack

バックエンド

バックエンドは問題ない模様。

どのバックエンド言語を選んでも自由だが、私のお勧めはNodejsだ。あなたはJavaScriptにすでに慣れていて、選ぶのが簡単だからだ。

  • Node.js
  • 🚩 CLIアプリケーション構築
  • PostgreSQL (普段使っているのは MySQLだが…)
  • 🚩 単純なCRUD
  • RESTful API
  • JWT Auth
  • Redis
  • 🚩 完全なアプリケーション
PoorStackPoorStack

DevOps

CI/CD や IaC 周りが弱い

  • Linux基礎
  • AWSの基本的なサービス
    • EC2
    • VPC
    • S3
    • Route53
    • SES
  • 🚩 アプリケーションのAWSへのデプロイ
  • Monit (未経験)
  • 🚩 監視(監視の経験はあり)
  • Github Actions (未経験)
  • 🚩 CI/CD
  • Ansible (未経験)
  • 🚩 デプロイの自動化
  • Terraform (未経験)
  • 🚩 インフラの自動化
このスクラップは3ヶ月前にクローズされました