検索結果0件」

    【将来性】今時のWeb系エンジニアを目指すなら学ぶべき言語5つ

    【将来性】今時のWeb系エンジニアを目指すなら学ぶべき言語5つ

    こんにちは、シンヤです!
    今回は【将来性】今時のWeb系エンジニアを目指すなら学ぶべき言語5つというテーマでお話しいたします。


    まず自分が「どんなエンジニアになりたいか」を理解する

    エンジニアと言っても、色々と種類があります。
    例としてあげると、以下になります。

    • Webエンジニア
    • iOSエンジニア
    • Androidエンジニア
    • インフラエンジニア

    などなどですね。
    私はWebのデザインを担当しているので、Webエンジニアと近しい間柄にあります。

    したがって本記事では、Webエンジニアになるための言語を解説いたします。
    そのほかのエンジニアの人には、参考にならないかもしれません。

    Web系のエンジニアに向いている人とは

    一言で言うと「目に見えてものを作るのが好きな人」かもしれません。
    私もそのうちの一人です。

    Web系エンジニアというのは、サイトを見た際に最初にみるページをデザインします。
    専門用語で「フロントエンドエンジニア」という事もあります。

    Web系と言っても、目に見えない裏側の部分を担当する人もいます。
    そういう人は「バックエンドエンジニア」と呼ばれます。

    したがって本記事では、Web系でも「フロントエンドエンジニア」に向けた記事内容となっております。
    私がWeb系のデザイナーなので、フロントエンドに近しい仕事をしているためです。


    言語を学習する際に大事な事

    様々ありますが、主に以下かと思います。

    • 学びやすいか
    • 流行りの言語か
    • 案件が豊富にあるか
    • 応用が可能か

    になります。
    それぞれ詳しく解説いたします。

    学びやすいか

    最初から難易度の高いプログラミング言語を学習するのは、オススメしません。
    なぜなら、挫折してしまいやすいからです。

    最初からすぐに覚える必要はありません。
    少しずつ初学者から上級者になっていけば良いのです。

    すぐに覚えられる言語はありません。
    しかし「学習しやすい言語」というのは存在するのです。

    プログラミング言語の中には、書いただけで実行しない言語もあります。
    「コンパイラ」といい、書いた言語をコンピューター言語に変換する必要があるものもあります。

    厳密には全ての言語は「コンパイル」がなされます。
    しかし言語によっては、コンパイルを手動で行う必要がある言語もあるのです。

    同時にコンパイラをする言語を「インタプリタ言語」と言います。
    よって最初に学習するなら「インタプリタ言語」が良いと思います。

    これから紹介する言語は、全て「インタプリタ言語」です。
    「コンパイラ言語」はご紹介しませんので、ご安心ください😊

    流行りの言語か

    仕事の案件数の獲得の目安いでいうと、流行りの言語かは大切です。
    なぜなら、案件数が多いからです。

    仕事の案件数が多ければ、それだけ労働条件を選べます。
    働く環境を、自ら選びやすくなるのです。

    これから紹介する言語は、案件数も多い傾向にあると思います。
    案件がないなら、学習しても意味が薄いものになってしまいますからね。

    ただ冒頭でも申し上げましたが、私はフロントエンド以外詳しくはありません。
    よってこれから紹介する言語も、フロントエンドに関連するものとなります。

    案件が豊富にあるか

    上記の「流行りの言語か」とも関連が深い項目になります。
    案件が豊富にないと、学ぶ意味が薄くなってしまいます。

    せっかく言語を習得したとしても、案件が少なければチャンスも少なくなります。
    まさに「宝の持ち腐れ」になってしまうかもしれません。

    プログラミングを学ぶ人には、エンジニアになりたい人も多いと思います。
    そのような人には、案件が豊富にある言語を学んでほしいと思います。

    応用が可能か

    今は案件が豊富にあっても、どんな言語もいつかは廃れていきます。
    その際に「応用が可能な言語」なら、少ない学習コストで新しい仕事を獲得できます。

    サービスというのは、将来どうなるかは誰にも予想できません。
    今学んでいる言語以外のものを使う事も、考慮しないといけません。

    基本的にどんなプログラミング言語も、応用が可能だと思います。
    しかしその中でも「応用可能の高い低い」というのはあります。

    基本的にWeb系なら「JavaScript」を学んでおけば良いと思います。
    これから紹介する言語も、JavaScriptを発展させたものも多いです。


    これからWeb系のフロントエンドエンジニアになるなら学ぶべき言語

    大変お待たせいたしました。
    ではこれから、学ぶべき言語を紹介していこうと思います。

    • React
    • Vue
    • TypeScrip
    • Git
    • PostCSS

    この5つになります。
    これさえ学びきれば、フロントエンドエンジニアとして仕事に困ることはないと思います。

    前述の通り私がWeb系のデザイナーなので、Web系の見た目に現れる言語を選択しました。
    これから順番に、各言語について解説していきます。


    React

    「React」は、Facebookが開発している言語です。
    安心のFacebook製なので、多くのプロジェクトで採用されている言語です。

    厳密に言えばReactは、言語というより「ライブラリ」です。
    ライブラリとは、Webアプリを作るために作られた「道具」のようなものです。

    後述のVueもそうなのですが、JavaScriptを発展させた言語になります。
    「JSX」という特殊な記法を用いて、プログラムを書いていきます。

    実はこのブログも「React」で作っております。
    なので私自身が、Reactに少しだけ詳しいと思います。

    以下にReactで書かれたプログラミング言語のサンプルを記載いたします。

    import React from 'react';
    
    import Header from '../components/Header';
    
    const notFoundPage = () => {
      return (
        <div>
          <Header />
          お探しのページは見つかりませんでした
        </div>
      );
    };
    
    export default notFoundPage;

    このブログの404ページです。

    1. 最初に「React」を読み込んで
    2. 必要な「Header」というComponentを読み込み
    3. 「notFoundPage」という名前でページを作り
    4. 「export default」で吐き出す

    という順番で処理が進んでいきます。
    後述のVueもそうなのですが、Webアプリでは「Component」を使って、必要なパーツを読み込み使いまわして開発します。


    Vue

    「Vue」とは、個人の方が開発されている言語です。
    こちらも正確に言えば「ライブラリ」の部類に入ります。

    基本的に初学者の方にオススメの言語となっております。
    なぜなら「生のHTMLの書き方に近いから」ですね。

    以下にVueで作られたコードを記載してみます。
    HTMLに詳しい方は、生のHTMLの書き方に近いのがわかると思います。

    <template>
      <div>
        <Header />
        <h1>{{ hello }}</h1>
      </div>
    </template>
    
    <script>
    import Header from './components/Header.vue'
    
    export default {
      data () {
        return {
          hello: 'Hello World!' + 'Vue.JS'
        }
      },
      components: {
        Header
      }
    }
    </script>
    
    <style>
    h1 {
      color: #ff0000;
    }
    </style>

    どうでしょうか。
    生のHTMLの書き方に近いと思います。

    上記は「Hello World Vue.JS」という文字を読み込み、「Header」というComponentを宣言している。
    という至ってシンプルなVueの書き方です。


    TypeScript

    「TypeScript」とは、マイクロソフトが開発しているプログラミング言語です。
    JavaScriptにはなかった「型のチェック」ができるようになっています。

    「型」とは、シンプルにいうと「どんな情報なのか」の宣言です。
    例えば、以下のようなものがあります。

    • 文字
    • 数字
    • 関数

    などなどです。
    それぞれ「どんな型なのか」をチェックしてくれる、便利な機能があります。

    最近のモダンな開発だと、ReactもしくはVueを使い、TypeScriptで型のチェックをしつつ、開発するのが多い気がします。

    私はプログラマーではないので、TypeScriptは少々扱いづらかったです。
    なのでこの項目の紹介は、これぐらいとさせていただきます。

    詳しくはUdemyで学んでみる事をオススメします。
    他人任せになってしまい、申し訳ございません🙇


    Git

    「Git」とは、バージョンを管理するツールのようなものです。
    なので厳密には「プログラミング言語」には含まれないかもしれません。

    Gitはどのプログラミングをやるにしても、必ず学習すると思います。
    なぜなら、Gitが使えないとそもそも開発に参加できないからです。

    どのプロダクトでも、必ずと言っていいほどGitでバージョン管理をしています。
    そもそもGitが使えないと、プロジェクトに参加できないのです。

    Gitはそれ自体が「ものを作る言語」ではございません。
    しかし、学ばないとプロジェクトに参加はほぼできないと思ったほうが良いです。

    なぜなら、冒頭でも申し上げた通り「Gitでバージョン管理を行うことがほとんどだから」です。
    バージョン管理に参加できないということは、プロジェクトに参加できないということなのです。

    Gitを詳しく学びたい方はサル先生のGit入門で学習するのをオススメします。
    このページの内容を学べば、プロジェクトに参加する分には問題ないと思います。


    PostCSS

    「PostCSS」とは、いろいろな人が開発したプラグインをインストールして、CSSのコンパイラーを作ります。
    早い話が「CSS版のnpm」という感じです。

    初学者の方には「npm」という単語自体が聴き慣れないかもしれません。
    ですが学習するうちにわかるようになります。

    要するに「自分だけのCSSコンパイラーが作れるツール」という感じです。
    なのでCSSの延長線上にある言語という感じです。

    「SCSS」と違い、PostCSSは自分でプラグインをインストールしないと使えません。
    このインストールするのが、npmと似ている部分なのだと思います。


    まずは手を動かしてみる

    Web系エンジニアを目指すなら学習すべきオススメの言語を再度復讐します。
    主に以下の5つです。

    • React
    • Vue
    • TypeScrip
    • Git
    • PostCSS

    この5つさえ学習できれば、フロントエンドエンジニアを名乗れるようになると思います。
    まずは実際に手を動かしてみて、何かを作り始めるのが良いと思います。

    とりあえず一通り触ってみて、自分がオススメの言語を深掘りすれば良いのです。
    最初はあまり硬く考えずに「とりあえず初めてみるか」という感覚で良いと思います。


    まとめ

    • まず自分がどんなエンジニアになりたいか、理解する
    • 目に見えるものを作るのが好きな人は、Web系エンジニアに向いている
    • 厳密に言えば、Web系の「フロントエンドエンジニア」に向いている
    • 紹介した言語を使えれば、「フロントエンドエンジニア」を名乗っても良いと思う

    今回は以上になります。
    次回の記事配信まで、お待ちくださいませ😊

    • 【将来性】今時のWeb系エンジニアを目指すなら学ぶべき言語5つ