こんにちは、アンドエンジニア編集部です。

**「プログラミングを学んでいまの業務への活用や転職・キャリアアップに繋げたい・・・」**

そのような思いから、プログラミングを学ぼうと考え中の方・あるいは学習中の方も多いのではないでしょうか？

しかし、実際どのように環境構築やテストを行えばいいのか、分からない方も多いと思います。

プログラミング学習ができる有名なサービスのひとつにProgateがありますが、Progateで学習したユーザーが実際に開発を始めると、**「開発環境の構築方法が分からない」「エラーが発生した時にどのように解決すればいいのか分からない」**といった課題に直面することもあるかと思います。

そんな中、**Progateでプログラミングを学んだ人が「その先」の「実践的なプログラミング」を学べるサービス『Progate Path』が2022年11月に公開されました**！

参考：[Progate Pathの公式サイト](https://path.progate.com/)

そこで、今回は**ProgateとProgate Pathの間にどんな違いがあるのか？Progate Pathで学べる実践的なプログラミングとは？アンドエンジニア編集部員が実際に体験してみました**！

#### balloon nao left
文系出身の元Webデザイナーで、使用経験があるのはHTML/CSS/PHP。Progateでプログラミング言語を学んだ過去あり。

#### balloon yuu right
元Webエンジニア。前職では企業向けのWebシステム開発案件でPHPを用いて開発していた。Progateを利用してプログラミングを学んだ過去あり。

#### balloon yuu right
まずはProgateってご存じですか？

#### balloon nao left
知ってる知ってる！**プログラミング学習ができるサイトでしょ**。有名だし使ったこともある！ 私はHTML/CSSのレッスンとかをやったんだけど、スライドの説明がイラストになっててわかりやすかった記憶がある。

#### balloon yuu right
その分かりやすさから、プログラミングをはじめたての場合まずProgateから手を付けるという人も多いですね。しかし、**Progateは始めやすい一方で、「終わったらどうする」「簡単すぎる」といった意見もあるようです**。

#### balloon nao left
終わったらどうするはたしかにそうかも。JavaScriptレッスンとかなら、「ホームページのこの部分を作るぞ！」みたいに学んだ内容を活かすイメージがなんとなく湧くけど、Rubyとかのレッスンになると「書き方覚えた！…このあとどうするの？」ってなっちゃいそう。

#### balloon yuu right
**そんな人たちにオススメなのが『Progate Path』です**！

#### balloon yuu right
Progate Pathは「実務につながる経験を積めるプログラミング学習サービス」として、2022年11月にリリースされました。

#### balloon yuu right
Progateではプログラミング言語の書き方を中心に学べますが、エンジニアとして仕事をする上では他のスキルも必要です。例えば、「コードを読む力」や「デバッグ力」、「検索する力」や「公式ドキュメントを読む力」などです。

#### balloon yuu right
**Progate Pathでは、それらの「エンジニアの実務に必要なスキル」を学ぶことができます**。

~~Progate Pathでは、エンジニアの実務で必要とされる「技術書で学べるスキル」「実務で身につけるスキル」の両方を学ぶことができる~~

#### balloon nao left
（急に説明口調になった...）つまり、**Progateは基礎となるプログラミングをメインに学べて、Progate PathはProgateで学べるプログラミング含め実務で使用する技術も学べる**ってこと？

#### balloon yuu right
その通りです。

#### balloon nao left
なるほどね。私が始めるならもう一度Progateからかな...。昔Progateでプログラミング言語を学んだけど、十分に勉強できていないから。

#### balloon yuu right
なおさんのような「昔Progateでプログラミング言語を学んだけど、十分に勉強できていない初心者」には、Progae Pathの公式サイトに公開されている『学習ロードマップ』を元に学習を進めてみるのが良いでしょう。

#### balloon yuu right
**Progate Pathでは、本気でエンジニアを目指す人向けに『学習ロードマップ』が公開されています**。

参考：[エンジニア就職までの学習ロードマップ](https://path.progate.com/roadmap)

#### balloon yuu right
今回は、そんなロードマップに沿って体験してみました！

### Web開発コースをはじめる方へ（Node.js）

~~Progateのログイン後に表示される上部メニューから、『学習ロードマップ』を見ることができる~~

#### balloon nao left
このコースを最後までやりきったらどうなるのですか？（Progate在住 わんこさん）

#### balloon nao left
こういうのが書いてあると、**自分でも「私は何のためにこのコースを受講するんだ？」って最初に意識できていいね**！

#### balloon yuu right
**「なんとなくやりました」より「このためにやってます」と意識できていた方が真剣に取り組めそうですよね**。

#### balloon yuu right
自分は2018年頃にProgateを使っていたのですけれど、当時はこのように改めてProgateの使い方や学習前の心構えを教えてくれるページがなかったので良いなと思います。

### 学習レッスン HTML & CSS 初級編

#### balloon yuu right
**直接学習と関係ない箇所はコピペできる機能があったり、分からなくなったらコーディングの画面から直接スライドへ戻れるようになっている**んですね。

#### balloon nao left
プログラミング初心者でもついていけそう！初心者に優しい設計だね。

#### balloon yuu right
HTML&CSSなどのマークアップ言語は、PHPやPythonなどのバックエンド言語とは異なり、プログラムが間違っていても動きます。プログラミング初心者あるあるの「エラーで詰まって先に進めない」という現象に陥りにくいこともあり、ついていきやすいと思います。

#### balloon nao left
急に難易度が上がった気がする...。

#### balloon yuu right
Node.jsはサーバーサイド側だからですね。前レッスンで学んだJavaScriptは「フロントエンド言語」、Node.jsは「JavaScriptをサーバーサイド上で動かす仕組み」という違いがあるので、なおさんのような初心者には難しく感じるかもしれません。

#### balloon nao left
飛ばしちゃダメ...？

#### balloon yuu right
**Node.jsはこの後のProgate Pathでめちゃくちゃ使いますし、Progate Pathを進めるのに不可欠な「コマンドラインの操作」も併せて覚えられる**ので、頑張って進めましょう！

### Progate CLI と Node.js の開発環境の構築

#### balloon nao left
Progate一通り終わったー！いよいよProgate Pathを進めていこうと思うんだけど「Progate CLI」と「Node.js」の準備が必要って書いてあるね？「Node.js」はさっきレッスンでやったけど…「Progate CLI」ってなに？ワンチャン無しでもいける？？？

#### balloon yuu right
なんでいけると思ったんですか？**Progate Path で学習を進める上で、「Progate CLI 」は必須ツール**です！

Progateが独自に開発したコード判定ツールです。Progate CLIを導入することで、ローカル環境でコードを書きながらも、Progate Pathのブラウザ上で自分自身のコードの判定を確認することが可能になります。

~~参考：[Progate Path 公式サイト](https://path.progate.com/)~~

#### balloon yuu right
ProgateはWeb上だけで学習を進められましたが、**Progate Pathは[公式サイト](https://path.progate.com/)にある説明を見ながら、自分でローカル環境を用意してレッスンを進めていく**んです。 ただ、最初の『Progate Pathとは？』でお話ししたようにProgate Pathではデバッグのレッスンも行うので、コードの判定や進捗の同期を行うために、Progate CLIが必要なんですね。

アンドエンジニア編集部員。元Webエンジニア、好きなプログラミング言語はPHP。

編集部：ゆう

アンドエンジニア編集部員。文系出身の元webデザイナー。

編集部：なお

実務スキルが学べる！？Progateとその進化版「Progate Path」の体験レポート！

**プログラミング検定とは、プログラミング能力を評価する検定です。**プログラミング検定にはレベルや使用する言語別に、さまざまな種類が設けられています。従来はITに関わる方たちのスキルレベルを評価する目的で利用されていましたが、この数年は小中学生の受験者も増えています。

ここでは、プログラミング検定が多くの世代に広がりを見せている理由を、簡単に解説します。

プログラミング言語とは？種類や選び方ついてわかりやすく解説

プログラミング言語を一覧でチェック！種類別・難易度別で紹介

### プログラミングは教育現場の必修科目に

2019年に情報教育加速のための教育情報化推進法が制定され、小学校では2020年度からプログラミング教育が必修化されました。中学校では2021年度より、技術・家庭科（技術分野）にプログラミングが組み入れられ、高等学校においても2022年度から「情報Ⅰ」が必修の科目に設定されました。

また、今後大学受験においても2024年度の大学入試共通テストから「情報」の必修化が予定されています。

**プログラミングを学ぶ教育上のメリットは、論理的思考力の向上です。**論理的思考力が高まると、物事の判断が合理的になり、問題解決能力が身につきます。複雑なプログラム作成は、チームで実施することがあります。その際チームワークを高めて活動するため、コミュニケーションと表現力が育成されます。

情報教育の成果として、学習意欲の向上や豊かな人間性を養うことが可能です。さらに、将来的にデジタル化社会を担う人材としても期待できるでしょう。

プログラミングの勉強方法とは？何から始めるべきか初心者向けに解説

プログラミングを勉強する順番を初心者向けに解説！目的別に何から学習すべき？

### プログラミング検定が広がっている理由

プログラミング検定が広がりを見せている理由としては、上述したとおり情報化社会におけるICT教育の重要性が高まったことが挙げられます。*プログラミングを学んでいる学生たちの学習理解度を測るため、検定を用いる機会が増加しています。*

また、近年スマホをはじめとするIT機器は生活に欠かせないものになっており、IoT技術より入手できるデータの有効活用も求められています。必然的に、これらの分野に携わる人材も増加しており、自身のスキルを証明するためプログラミング検定は利用されています。

これまでIT分野で働いたことがなくても、プログラミング検定を目標に据えながら独学で勉強することで、ITエンジニアとして活躍できる可能性は十分にあります。未経験からITエンジニアを目指すなら、自分のスキルにあった企業を探してくれる転職エージェントの活用をおすすめします。

IoTとは？概要から動作の仕組み・実際の用途まで丁寧に解説！

ITエンジニアとはどんな職種？仕事内容や必要スキルを詳しく解説！

<center>[あなたに合った企業選びをサポート致します。 エンジニア転職のご相談はぜひ *『マイナビIT エージェント』*へ！](https://mynavi-agent.jp/it/?utm_source=and-engineer&utm_medium=content-text&utm_campaign=acv12_2)</center>

*プログラミング検定は、種類も豊富で難易度も多岐にわたります。*ここでは、小中高校生、大学生・社会人と年代別に概要を解説していきます。

*小中学生は、ビジュアルプログラミングが主体です。*Scratchを用いてアルゴリズムやロジックの考え方を学んでいきます。

主な検定試験はプログラミング能力検定（プロ検）のビジュアル言語版や、サーティファイのジュニア・プログラミング検定、日商プログラミング検定（ENTRY）などがあります。

【参考】：[Scratch](https://scratch.mit.edu/)
【参考】：[プログラミング能力検定（プロ検）](https://programming-sc.com/)
【参考】：[ジュニア・プログラミング検定](https://www.sikaku.gr.jp/js/ks/)
【参考】：[日商プログラミング検定](https://www.kentei.ne.jp/pg)

Scratchとは？広がるプログラミング教育の世界を解説！

*中学生から高校生にかけて、実際のプログラミング言語を用いて徐々にコード作成を学びます。*具体的には、JavaScriptやPythonを中心に学習していきます。主な検定試験はプログラミング能力検定（プロ検）のテキスト言語版や、日商プログラミング検定（STANDARD）などがあります。

【参考】：[プログラミング能力検定（プロ検）](https://programming-sc.com/)
【参考】：[日商プログラミング検定](https://www.kentei.ne.jp/pg)

JavaScriptとは？その特徴やメリット・デメリットを解説！

Pythonの勉強方法・手順とは？具体的なロードマップを解説！

*大学生や社会人は、より多岐に渡ったアルゴリズム実装やプログラミングを学びます。*具体的には、サーティファイが実施するC言語プログラミング能力認定試験、Java™プログラミング能力認定、実践プログラミング技術者試験などの個別プログラミング言語の検定が挙げられます。

また、将来的なシステムエンジニアやシステムアーキテクトなどへのステップアップを見据えて、情報処理推進機構（IPA）が実施する、情報処理技術者試験の基本情報技術者試験などを目指す方も多いです。

【参考】：[C言語プログラミング能力認定試験](https://www.sikaku.gr.jp/js/cpjv/)
【参考】：[Java™プログラミング能力認定](https://www.sikaku.gr.jp/js/cpjv/jv/introduction/)
【参考】：[実践プログラミング技術者試験](https://www.sikaku.gr.jp/js/jp/)
【参考】：[情報処理技術者試験 基本情報技術者試験](https://www.ipa.go.jp/shiken/kubun/fe.html)

システムエンジニア（SE）とはどんな仕事？スキルや年収なども解説

システムアーキテクトとは？年収と将来性を解説！

基本情報技術者試験とは？資格のメリットや学習方法を解説！

<center>[エンジニア転職を成功させるため ぜひ*『マイナビIT エージェント』*をご活用ください！](https://mynavi-agent.jp/it/?utm_source=and-engineer&utm_medium=content-text&utm_campaign=acv12_2)</center>

## プログラミング検定のおすすめ一覧


*プログラミング検定は、小学生向けから実務経験者向けまで多岐に渡ります。*ここでは、主に活用される検定試験とその特徴を解説していきます。

### プログラミング能力検定（プロ検）

プログラミング能力検定は、プログラミング総合研究所が実施する検定で、略して「プロ検」と言います。小学生・中学生・高校生を対象とします。**主に小学生向けのビジュアルプログラミング言語と、中高生向けのテキストプログラミング言語に対応します。**

プログラミング能力検定は、2022年度より高校で必修化された「情報Ⅰ」のプログラミングに対応しています。また、2024年度の大学入試共通テストから必修を予定する、「情報」科目のプログラミングの対策試験としても利用可能です。

ビジュアル言語版とテキスト言語版の合格ラインは、共に得点率60%です。使用するプログラミング言語と設定レベルは以下の通りです。

・*ビジュアル言語版*
オリジナルのビジュアルプログラミング言語が用いられます。小学生向けの検定試験で、1〜4の全4レベルで構成されています。

・*テキスト言語版*
プログラミング言語はJavaScriptとPythonに対応します。中高生向けで、1〜6の6段階のレベルからなります。

【参考】：[プログラミング能力検定（プロ検）](https://programming-sc.com/)

プログラミング能力検定とは？試験概要や出題範囲を詳しく解説

### ジュニア・プログラミング検定

ジュニア・プログラミング検定はサーティファイが実施する検定で、正式には「ジュニア・プログラミング検定 Scratch部門」です。小学校やプログラミングスクールで利用されています。

Scratch2.0ならびにScratch3.0を使用し、4つのレベルに応じた範囲と難易度が設定されています。2016年から実施しており、実績が豊富です。合格基準は得点率60%以上です。

・*Gold（1級）*
Scratchの複数の条件分岐や演算、入れ子構造のスクリプトなどを使って、様々なスプライトを連動させたプロジェクトを作成することが求められます。合格により、複数の条件や筋道を組み合わせた論理的思考ができることが証明されます。

・*Silver（2級）*
Scratchの複数の条件分岐や入れ子構造のスクリプトなどを使って、少数のスプライトを連動させたプロジェクトを作成することが求められます。合格により、基本的な条件や筋道を用いた論理的思考ができることが証明されます。

・*Bronze（3級）*
Scratchの条件分岐や繰り返しなどのスクリプトを使って、少数のスプライトを連動させたプロジェクトを作成することが求められます。合格により、単純な条件や筋道を用いた論理的思考ができることが証明されます。

・*Entry（4級）*
Scratchの条件分岐や繰り返しなどのスクリプトを使って、1つまたは2つのスプライトを連動させたプロジェクトを作成することが求められます。合格により、入門レベルの特定の条件や筋道を用いた論理的思考ができることが証明されます。

**令和5年入学からの中学入試の入試優遇にも利用されています。**

【参考】：[ジュニア・プログラミング検定](https://www.sikaku.gr.jp/js/ks/)
【参考】：[ジュニア・プログラミング検定 入試優遇校一覧](https://www.sikaku.gr.jp/js/ks/nyuushi/)

*日商プログラミング検定は、日本商工会議所が実施するプログラミングスキルを評価する検定です。*以下の4段階のレベルが設定されており、いずれも70点以上で合格です。

・*EXPERT*
プログラマとしての基本能力を評価し、仕様書に基づくソフトウェアの一部を作成できることが求められます。IT企業における技術者要件を満たす人材育成や、採用要件で活用されることを想定しています。プログラミング言語は、Java・C言語・VBA・Pythonの4言語でそれぞれ実施します。

・*STANDARD*
高校・大学・専門学校等でのプログラミング学習の習得度を評価します。IT利用企業を想定し、プログラミングの基本知識・スキルを言語別に検定します。プログラミング言語は、Java・C言語・VBA・Pythonの4言語でそれぞれ実施します。

・*BASIC*
プログラミングに関するITの基本知識、簡単なアルゴリズムについて問われます。企業人の基本的な知識を想定し、言語によらない設問です。

・*ENTRY*
小中学生が学ぶ、ビジュアルプログラミング言語のScratch（Scratch3.0）を用います。簡単なプログラミングおよびプログラミング的思考を問い、プログラミングの「学び方」を理解しているか確認します。

【参考】：[日商プログラミング検定](https://www.kentei.ne.jp/pg)

日商プログラミング検定とは？試験概要や取得のメリットを解説！

### 言語別プログラミング能力検定

ある程度基礎的なことが理解できたら、言語別検定に挑戦することもできます。例えば、サーティファイでは以下のような言語別、レベル別検定試験を提供しています。

検定試験は得点別に5段階にレベル分けされ、業務レベルのスキルが証明されます。Platinum（Level 5）は800点以上、Gold（Level 4）は600～799点、Silver（Level 3）は400～599点、Bronze（Level 2）は200～399点、Entry（Level 1）は0～199点が該当します。

・*C言語プログラミング能力認定試験・Java™プログラミング能力認定*
ともに1級〜3級の3段階のレベルが設定されており、1級はPCを使用した実務試験で、業務レベルのスキルが証明されます。合格基準は得点率60%以上です。

【参考】：[C言語プログラミング能力認定試験 Java™プログラミング能力認定](https://www.sikaku.gr.jp/js/cpjv/)
【参考】：[C言語プログラミング能力認定試験 試験概要](https://www.sikaku.gr.jp/js/cpjv/cp/introduction/)
【参考】：[Java™プログラミング能力認定 試験概要](https://www.sikaku.gr.jp/js/cpjv/jv/introduction/)

・*実践プログラミング技術者試験*
「実践プログラミング技術者試験　Java™部門」「実践プログラミング技術者試験　C言語部門」「実践プログラミング技術者試験　Python部門」の3つの区分からなります。Java™、C言語、Python3がそれぞれに6題ずつ出題されます。

【参考】：[実践プログラミング技術者試験](https://www.sikaku.gr.jp/js/jp/)

C言語の資格とは？特徴・資格の種類や難易度・勉強方法を解説

基本情報技術者試験は、情報処理推進機構（IPA）が実施するIT技術者向け試験である情報処理技術者試験の1つです。情報処理技術者試験は、IT技術者育成のためにIT利用者向けのITパスポートから、高度情報処理技術者まで多くの試験区分があります。

**国家試験ですので企業の認知度が高く、将来的にシステムエンジニアやシステムアーキテクト、あるいはプロジェクトマネージャを目指す方の最初のステップとなります。**共通キャリアフレームワークのITSSスキルレベル2に相当しますので、難易度は他のプログラミング検定より高めです。

基本情報技術者試験では、ソフトウェア開発のプログラミング言語から、Ｃ言語・Java・ECMAScript・Perl・Ruby・PHP・Python・アセンブラ言語・表計算ソフトなどから出題されます。

【参考】：[情報処理技術者試験 基本情報技術者試験](https://www.ipa.go.jp/shiken/kubun/fe.html)
【参考】：[情報処理技術者試験 試験区分一覧](https://www.jitec.ipa.go.jp/1_11seido/seido_gaiyo.html)
【参考】：[情報処理安全確保支援士試験 試験で使用する情報技術に関する用語・プログラム言語など](https://www.jitec.ipa.go.jp/1_13download/shiken_yougo_ver5_0.pdf)
【参考】：[情報処理技術者試験・情報処理安全確保支援士試験　試験要綱](https://www.ipa.go.jp/shiken/syllabus/t6hhco0000004yy7-att/youkou_ver5_2.pdf)

基本情報技術者試験の難易度は高いのか？資格取得のメリットを解説！

ITパスポート試験とは？メリットや試験詳細・学習方法を解説！

情報処理安全確保支援士試験とは？難易度やおすすめの参考書を紹介

## プログラミング検定のメリット

これまで検定試験は意味がないという見方もありましたが、現在ではプログラミング教育への取り組みが進んだことで、検定の注目度が高まっています。ここではプログラミング検定の具体的なメリットを解説します。

*現在、自分にはどれくらいの知識とスキルがあるのかを把握できます。*教育カリキュラムに組み込まれ始めたプログラミングですが、レベルや理解度はそれぞれ異なります。検定に合格することで習熟度が把握できるので、その後の勉強も進めやすくなります。

*検定合格によりスキルレベルが把握できれば、対外的な能力の証明に繋がります。*現在、プログラミング業務に携わっている方はもちろん、今後携わりたいと思っている方も、客観的にスキルを証明できるので、より高度な仕事を任せられたり即戦力として採用されたりと、活躍の場を広げられるでしょう。

プログラマーに資格は必要？資格を取るメリットとおすすめの資格8選

一般的なプログラマーの年収は「マイナビエージェント 職種図鑑」での平均年収は344万円（※2023年7月執筆時点）、経済産業省2017年発表の「IT関連産業の給与等に関する実態調査結果」からエンジニア/プログラマを参考にすると、平均年収592万円と分かりました。

国税庁2020年発表の「民間給与実態統計調査」における民間企業平均年収は433万円なので、プログラマーの年収は調査媒体によってバラつきがあることが分かります。

*プログラマーを含むITエンジニアの報酬は実績が重要視される傾向があるため、さらに年収を上げるには、スキルアップを図る方法が効果的です。*プログラミング検定合格に向けて勉強し、より技術を高めることで、年収アップの可能性が高まります。

【参考】：[マイナビエージェント 職種図鑑](https://mynavi-agent.jp/it/jobindex/04.html?utm_source=and-engineer&utm_medium=content-text&utm_campaign=acv12_2)
※【平均年収 調査対象者】2020年1月～2020年12月末までの間にマイナビエージェントサービスにご登録頂いた方
【参考】：[IT関連産業における給与水準の実態① ~ 職種別（P7）](https://warp.da.ndl.go.jp/info:ndljp/pid/11623215/www.meti.go.jp/press/2017/08/20170821001/20170821001-1.pdf)
【参考】：[民間給与実態統計調査-国税庁](https://www.nta.go.jp/publication/statistics/kokuzeicho/minkan2020/pdf/002.pdf)

## プログラミング検定合格に向けた勉強方法

プログラミング検定は、プログラミング能力を評価する検定です。学校教育での情報教育義務化に伴い、すでに小中高校生向けの授業にプログラミングが取り入れられています。ここでは、プログラミング検定が注目されている理由やメリット、おすすめの検定試験について解説していきます。

プログラミング検定はプログラミング能力を評価する検定で、小学生向けから提供されています

学校教育の情報教育義務化に伴い、プログラミングの重要性が高まっています

プログラミング検定により情報教育の進捗が客観的にわかり、次のステップへの準備が可能です

プログラミング検定とは？おすすめの検定試験や受験のメリットを解説！

## Notionでプログラミングノートを作って効率化しよう

Notionは、オールインワン・ワークスペースとして知られる文書管理ツールです。文書の作成や管理、共有に便利な様々な機能を持ち、情報管理の効率化に役立ちます。

**Notionが持つ機能は、プログラミングノートの作成にも適しています。**ページの階層構造やデータベースで情報を管理し、リンクブロックやコードブロックなどの便利なブロックにより、分かりやすく、見やすく情報をまとめることができます。

この記事では、プログラミングノートの作成に適したツールを探している方のため、Notionでプログラミングノートを作るメリットや、実際の作成方法を図解します。Notionでどのようなプログラミングノートが作れるかチェックしてみてください。

【参考】：[Wiki、ドキュメント、プロジェクトがつながるコネクテッドワークスペース | Notion （ノーション）](https://www.notion.so/ja-jp)

Notionとは？基本的な使い方やEvernoteとの違いを解説

## Notionでプログラミングノートを作るメリットとは

Notionでプログラミングノートを作るメリットとして、まずは情報を一元化して管理できることが挙げられます。また、Notionの便利な各種機能を使って情報をまとめられること、環境が異なってもアクセスでき、共有しやすい点もNotionを使うメリットです。

### カテゴリ別の情報やデータベースを一元化できる

Notionでは親ページと子ページの階層構造を作成できます。そのため、親ページに「プログラミング言語」、その子ページに「ブックマーク」や「コードスニペット」という様に、カテゴリごとに情報を整理することができます。

また、親ページにデータベースをインライン形式でページに埋め込んで表示することもできます。

*これにより、親ページをトップとする各種情報の一元管理が可能です。*

下の図は、今回作成を解説するプログラミングノートの親ページの表示です。ここから、各種情報のページやデータベースにアクセスできます。

ページの上半分が階層構造のリンクで構成され、下部にはプログラミング覚書のデータベースがインライン表示されています。

~~【図】：Notionで作成するプログラミングノートのイメージ~~

### Notionの様々な機能を活用できる

*Notionは、プログラミングコードの作成に便利な様々な機能を備えています。*参考URLの埋め込み、動画や画像、ファイルデータのアップロードなどが可能で、コードブロックを利用してコードを直接記録することもできます。また、テキストやレイアウトをカスタマイズして、見やすく情報をまとめることができます。

### 異なる環境からのアクセスや共有が容易

Notionはクラウドベースのツールのため、インターネット接続があればどこからでもアクセスできます。*そのため、職場や自宅からだけでなく、カフェや出張先など、普段と異なる場所からでもプログラミングノートにアクセスできるメリットがあります。*

また、Notionは情報の共有も得意としています。作成したページを他のメンバーやチーム、会社全体で共有したり、外部のエンジニアや顧客に公開したりすることも可能です。個人的に作成したプログラミングノートでも、必要に応じて共有することでチームの生産性向上につながるでしょう。

## Notionで作るプログラミングノートの内容例

そもそも、プログラミングノートでまとめると便利な情報とはどのようなものでしょうか。人により大きく異なるかと思いますが、ここでは、一般的にプログラミングノートにまとめると役立つ内容について挙げてみます。

プログラミングを行う上で、各種サービスの公式サイト、コミュニティ、技術系Webサイトなどから情報を得ることが多くあるでしょう。ブラウザのお気に入りに保存して整理してもいいのですが、Notionを使ってブックマーク集を作成すると、様々なシーンで便利に活用できます。

*Notionを使うと、ノート内にリンクブロックを追加することで、WebサイトやページのURLを直接挿入できます。*このリンクにはタイトルや説明文を付け加えることもでき、自分なりの追加情報を記載することもできます。

~~【図】：プログラミング関連ブックマーク集の例~~

日々コーディングを行う人にとっては、よく使うコードをすぐ使えるようにまとめたコードスニペット、コードストックでコード管理をしておくと便利です。

IDE（統合開発環境）やコードエディタなどではスニペット機能が用意されていることも多いですが、自分が使いやすいように書いたコードのスニペットを保存しておくことで、開発の効率がさらに向上するでしょう。

*Notionでは、ノート内にコードブロックを配置し、その中にコードを視認しやすく残しておくことができます。*コピーもクリック1つで簡単に行えて便利です。

~~【図】：コードスニペットの例~~

IDEとは？詳細やメリット、おすすめのIDEを紹介します！

プログラマーにとっては、エラーやトラブルヘの対処は日常的なことであると言えます。トラブルが発生し、何とか解決したと思ったら、忘れた頃に同じトラブルに見舞われる、という状況もよくあることでしょう。

時間がかかったトラブルや、複雑な手順を要するトラブルを解決した時には、どのようにして問題を解消したかを記した自分用のトラブルシューティングを用意することが、後の助けになります。

*また、Notionを活用すれば、同じ環境で作業している同僚が同じトラブルに遭遇した時、解決のための情報を共有することも容易です。*

~~【図】：トラブルシューティング集の例~~

プログラミングの業務中や学習中に学んだことや理解した内容を覚書としてまとめることで、後のプログラミングの役に立ちます。また、なんとなく技術系Webサイトやブログを巡っていて、いつか使いたいテクニックや、理解しておきたい技術、興味があるトピックスに出会うこともよくあるでしょう。

そんなときは、どのようなことでもプログラミング覚書に保存しておくことで、後から見返して理解を深めることができます。

*Notionのデータベースを活用すれば、整理しやすいようにタグ付けや分類することができます。*

~~【図】：プログラミング覚書データベースの例~~

## Notionページを階層化してまとめる方法

Notionで情報をまとめる1つの方法として、ページを階層化してまとめる方法があります。階層化された親ページと子ページの形式は、情報を論理的に整理するのに役立ちます。

親ページにカテゴリをまとめ、それぞれの項目に紐付く詳細情報を子ページとして追加することで、ノートの構造が明確になります。

ここでは、実際に親ページと子ページを作成し、その階層構造を確認する例を紹介します。あわせて、情報を表示するためのブロックについても解説します。

### 親ページと子ページを作成して階層化する

以下の図が、親ページの下に子ページを作成して情報をまとめるイメージです。例では、各プログラミング言語の下に、ブックマーク集、コードスニペット、トラブルシューティングがあり、さらにその下に詳細情報があるという構造になっています。

~~【図】：親ページの下に子ページが配置されている~~

それでは、まず親ページを作ってみましょう。

「新規ページ」をクリックして、「無題」のところに親ページのタイトルを入力します。「空のページ」をクリックすると、新規ページが作成されます。

~~【図】：親ページを作成する~~

作成されたページ内のブロック挿入箇所で「＋」をクリックして、ブロックの種類を選択し、自分の好みのレイアウトの親ページを作成しましょう。

下図の例では、3列のブロックにして、見出し2を使ってカテゴリ分けを表示しました。*もちろん、後からブロックの位置や種類の変更などのカスタマイズも簡単です。*

~~【図】：親ページのレイアウトを決める~~

親ページ内に子ページを追加します。子ページを追加したいカテゴリの下に、ページブロックを追加します。ここでは、「プログラミング言語」の下に「HTML」の子ページを作成するために、「＋」をクリックし「ページ」を選択すると、親ページの下に新規ページが作成されます。

~~【図】：子ページを作成する~~

*子ページを作ると、左側のサイドバー領域に、その子ページが親ページの下に配置されていることがわかります。*また、ページ左上に表示されるリンク構造にも表示されるため、現在作業しているページが確認できます。

~~【図】：サイドバー領域とリンク構造で階層を確認~~

### リンクブロックやコードブロックを活用してまとめる

Notionには様々な種類のブロックが用意されています。*画像や動画の埋め込み、外部サービスとの連携、Notion AIの利用など、使いたいブロックを自由に配置してページを作成できるのがNotionの大きな特徴です。*

プログラミングノート作成の第一段階としては、リンクブロックとコードブロックを活用してみると良いでしょう。

*■リンクブロックを使ったブックマーク集の作り方*
関連するウェブサイトや記事へのリンクをリンクブロックとして追加することで、外部の情報に簡単にアクセスできます。ブックマーク集を作る際にも活用できます。

リンクブロックを作成するには、ページ内の「＋」をクリックし、「Webブックマーク」を選択します。URLを入力し、「ブックマークを作成する」をクリックすると、リンクからビジュアルブックマークが作成されます。

プログラミングの記事（4ページ目）