🤖

生成AIでコードを書いている非エンジニア向けの、これだけ最低限勉強しておけば死なないリスト.v2025

2025/01/02に公開

TL;DR

https://roadmap.sh/frontend?r=frontend-beginner
https://roadmap.sh/backend?r=backend-beginner
https://roadmap.sh/devops?r=devops-beginner
https://roadmap.sh/git-github?r=git-github-beginner

はじめに

https://x.com/hayakawagomi/status/1873654789109895397

リストを紹介するだけでお金がもらえるらしいのでroadmap.shで最もシンプルなBeginnerリストを紹介していきたいと思います。

https://roadmap.sh/
https://github.com/kamranahmedse/developer-roadmap

フロントエンド

https://roadmap.sh/frontend?r=frontend-beginner

フロントエンド開発者は、ウェブアプリケーションのユーザーが直接触れる部分、つまりブラウザに表示される部分の開発を担当します。
HTMLやCSSでデザインを構築し、JavaScriptを用いてインタラクティブな機能を実現します。

フロントエンド開発者として以下のスキルやツールを習得することを推奨します。

HTML

  • ウェブページの骨組みを作るためのマークアップ言語。
  • ページ構造を定義し、情報を整理する役割を持ちます。

CSS

  • ページのデザインやレイアウトを設定するためのスタイルシート言語。
  • フォント、色、レイアウト、アニメーションなどを調整可能。

JavaScript

  • ページに動的な機能を追加するプログラミング言語。
  • イベント処理やAPIとの連携を実現。

GitとGitHub

  • ソースコードの変更履歴を管理するバージョン管理システム。

https://roadmap.sh/git-github?r=git-github-beginner

npm

  • JavaScriptのパッケージマネージャー。
  • 外部のライブラリやツールをプロジェクトに簡単に追加できます。

React

  • ユーザーインターフェースを構築するためのJavaScriptライブラリ。
  • コンポーネントベースの設計が特徴で、再利用性が高い。

Tailwind

  • ユーティリティファーストのCSSフレームワーク。
  • デザインを効率的に構築するためのクラスが用意されています。

Vitest

  • フロントエンドのテストを行うためのテスティングフレームワーク。
  • テストの自動化やコードの信頼性を向上させます。

バックエンド

https://roadmap.sh/backend?r=backend-beginner

バックエンド開発者は、ユーザーから見えない部分を開発し、ウェブアプリケーション全体の動作を支える役割を担います。
データベースやAPI、サーバーの構築、ビジネスロジックの実装などを担当します。

バックエンド開発者として以下のスキルやツールを習得することを推奨します。

プログラミング言語

  • Go: 高速で効率的なサーバーサイド言語。
  • JavaScript: フロントエンドで広く使われるJavaScriptをバックエンドにも活用。
  • Python: 学習が容易で多くのライブラリが利用可能。

GitとGitHub

  • Git: ソースコードの変更履歴を管理するバージョン管理システム。

https://roadmap.sh/git-github?r=git-github-beginner

リレーショナルデータベース

  • PostgreSQL: 高性能なリレーショナルデータベース。
  • ORM (Object-Relational Mapping): プログラムコードとデータベースのやり取りを簡略化。
  • ACID: トランザクションの信頼性を保証する基本概念。
  • N+1問題: データベースのクエリ効率化に関する重要な課題。

API開発

  • JSON APIs: APIで広く使用されるデータフォーマット。
  • REST: Webサービスの設計ガイドライン。
  • JWT (JSON Web Token): API認証に使用されるトークン方式。

キャッシング

  • Redis: メモリ内データストア。キャッシングやセッション管理に最適。
    • HTTPキャッシングやデータキャッシングの戦略も学習。

テスト

  • 統合テスト (Integration Testing)機能テスト (Functional Testing)単体テスト (Unit Testing): 各テスト手法を活用してコード品質を向上。

DevOps

https://roadmap.sh/devops?r=devops-beginner

DevOps開発者は、開発チーム(Developers)と運用チーム(Operations)の連携を円滑にし、ソフトウェアの迅速かつ信頼性の高いデリバリーを実現する役割を担います。
自動化、インフラ管理、モニタリングを中心に、継続的な改善を推進します。

DevOps開発者として以下のスキルやツールを習得することを推奨します。

プログラミング言語

  • PythonまたはGoを学び、スクリプト作成や自動化ツールの開発に活用します。

オペレーティングシステム

  • Linuxを習得:
    • ファイルシステム、パッケージ管理、サービス管理。
    • Bashスクリプト、ログ確認、プロセスモニタリング、ネットワークツールの使用方法。

ネットワークとプロトコル

  • DNS、TCP/IP、SSH、ポート、ゲートウェイ、IPアドレス、サブネッティングなどを理解し、トラブルシューティングに活用。

コンテナと仮想化

  • Dockerを習得:
    • Dockerfileの作成、コンテナの運用、ネットワークとストレージの管理。
    • セキュリティと軽量OS(例: Alpine Linux)の基本知識を学びます。

GitとGitHub

  • Git: ソースコードの変更履歴を管理するバージョン管理システム。

https://roadmap.sh/git-github?r=git-github-beginner

クラウドプロバイダ

  • AWSGCPAzureのいずれかを選択:
    • AWSでは、以下のサービスを重点的に学びます:
      • VPC、EC2、S3、IAM、RDS、Route53、Cloudwatch、ECS。

インフラストラクチャ自動化

  • Terraform: Infrastructure as Code(IaC)の概念を習得。
    • AWSなどのクラウドリソースを自動作成、管理するスクリプトを記述。

構成管理

  • Ansible:
    • ロール、プレイブック、インベントリ管理、構成の自動化。

CI/CD

  • GitHub Actionsや他のCI/CDツールを使用して、継続的インテグレーション(CI)と継続的デリバリー(CD)を実現。

Webサーバー

  • Nginx:
    • リバースプロキシ、キャッシング、負荷分散、TLS設定などの基礎を習得。

その他

私見でフロントエンド、バックエンド、DevOpsに使えるスキルやツールを紹介します。

JSON

JSON(JavaScript Object Notation)は、軽量なデータ交換フォーマットです。構造化データを簡単に記述でき、人間にも機械にも読みやすい形式で提供されます。

  • 生成AIで使用するAPIでのデータの送受信。
  • 設定ファイルや構成情報の保存。
  • データベースやアプリケーション間のデータ交換。
  • キーと値のペアでデータを表現する(オブジェクト形式)。
  • 配列やネストされた構造をサポート。
  • プログラミング言語に依存しない汎用性の高いフォーマット。

Markdown

Markdownは軽量マークアップ言語で、プレーンテキストで書かれた文書を簡単にフォーマットできます。文書の見た目を整えるための記法がシンプルで使いやすいのが特徴です。

  • 生成AIで使用するドキュメントやREADME.mdファイルの作成(GitHubやGitLabでよく使用)。
  • ブログやウェブサイトのコンテンツ作成。
  • ノートやタスクリストの作成。
  • シンプルな記法でヘッダー、リスト、リンク、画像などを表現。
  • HTMLや他のフォーマット(PDF、DOCなど)への変換が容易。
  • プログラマーやライターに愛用される多くのエディタでサポート。

Vite

高速なフロントエンドビルドツール。開発サーバーの起動が高速で、モジュールのホットリロードに優れています。

  • 開発速度を重視したプロジェクトやモダンなフロントエンド環境の構築。
  • ESモジュール(ESM)を活用した開発環境。
  • モダンなフレームワーク(React, Vue, Preactなど)との相性が良い。
  • プロダクションビルドではRollup(もうすぐRolldownに移行)を使用して効率的なバンドルを生成。

Astro

静的サイトジェネレーター(Static Site Generator, SSG)。複数のフレームワークを統合して使用でき、未使用のJavaScriptを自動的に除外。

  • ブログ、ドキュメントサイト、ポートフォリオサイトの構築。
  • React, Vue, Alpine.jsなどのモダンなフレームワークを組み合わせて使用可能。
  • JavaScriptのランタイム負荷を最小化(「部分的なハイドレーション」を採用)。
  • 高速でSEOに強い静的サイトを生成。

SQLite

軽量で組み込み型のリレーショナルデータベース。外部サーバーが不要で、1つのファイルでデータを管理。

  • モバイルアプリ、デスクトップアプリ、小規模なウェブアプリ。
  • 小規模なアプリケーションやプロトタイプ開発に最適。
  • ACIDトランザクションをサポート。
  • 高速でメモリ消費が少ない。

Caddy

モダンなWebサーバー。自動TLS(Let's Encrypt対応)や簡単な設定で知られる。

  • セキュアなWebサーバー、リバースプロキシ、ローカル開発環境。
  • HTTPSがデフォルトで有効。
  • 設定ファイルが簡潔(Caddyfileを使用)。
  • 動的なリバースプロキシとしても利用可能。

Cloudflare Tunnel

プライベートなサーバーやサービスをインターネットに安全に公開するトンネルサービス。

  • ローカル環境の公開、セキュアな外部アクセス。
  • リバースプロキシを用いずにサーバーをインターネットに公開可能。
  • Cloudflareのセキュリティとパフォーマンス機能を活用。
  • トンネルの設定が簡単で、個人利用にも適している。

Tailscale Funnel

Tailscaleネットワーク内のサービスをセキュアに公開する機能。

  • 分散チームや個人が管理するサーバーの公開、プライベートリソースの共有。
  • セットアップが簡単で、エンドツーエンド暗号化を提供。
  • プライベートネットワークを外部に公開しつつもセキュリティを確保。
  • 他のTailscaleユーザーや外部アプリケーションとの安全な通信を実現。

おわりに

その他で紹介したMarkdownは生成AIで生成した文章をコピーすると当たり前のように見かけるようになりましたし、JSONは以前mizchiさんが紹介していてハッとしました。

https://zenn.dev/mizchi/articles/json-for-everyone

Vite, Astro, SQLiteはそれぞれRoadmapに不足していた気がしたので追加しました(Rails 8とLaravel 11、State of JavaScriptからピックアップ)。
CaddyとCloudflare Tunnel(Tailscale Funnel)は実際に私が画像生成AIで使っているので紹介しています。

今回この記事に以下記載があったため書いてみました。Zennでも大丈夫かな?

https://note.com/hirokivv/n/ncecddc141065

なお、本記事の内容は完全に私見ですので、勢いよくマサカリを投げるのはご勘弁ください。私に投げる代わりに「これ要らん/コレが要るぞ」みたいな話を、各々のnoteやQiitaでまとめてくださると、インターネットに知が放流されてみんなハッピーになります。

Discussion