[{"data":1,"prerenderedAt":271},["ShallowReactive",2],{"article-studyflow-lamp-byself":3},{"id":4,"title":5,"body":6,"category":257,"createdAt":259,"description":5,"extension":260,"index":261,"meta":262,"navigation":263,"path":264,"publish":263,"seo":265,"series":261,"seriesTitle":261,"stem":266,"tag":267,"thumbnail":269,"updatedAt":261,"__hash__":270},"articles\u002Farticles\u002Fstudyflow-lamp-byself.md","一人でLAMP環境を作れるようになるまでの勉強フロー。",{"type":7,"value":8,"toc":238},"minimark",[9,13,16,19,22,55,60,63,66,70,73,76,80,83,86,89,92,95,98,101,114,117,120,123,126,146,149,152,155,158,161,164,167,170,178,181,195,198,202,205,222,225,229,232,235],[10,11,12],"p",{},"こんにちはjunです。私はフロントエンド エンジニアとして2019年の12月にWeb系会社に入りましたが、社員数が少ない上に複数のお取引先のサイトを保守しているのでサーバーの知識がまず必要になりました。",[10,14,15],{},"入社前まではサーバーというとXserverのようなレンタルサーバーにFTPを使ってファイルを転送したり、MAMPやXAMMPを用いてサーバーに似た環境を整えるといったぐらいの知識しかありませんでした。",[10,17,18],{},"ですがなんやかんや勉強したり仮想環境を用いて構築を行いました。おかげで入社3ヶ月目には実務上必要なLAMPサーバー構築作業ができるようになり、本番用のサーバーの構築も行い現在稼働しています。さらにインフラ部分とフロント部分との繋がり、またWebサービスの提供がどうやって行われるのかをよく理解できました。",[10,20,21],{},"今回の記事では実務上に求められるサーバー構築ができ、そしてある程度インフラ部分がわかるようになるため私が行った・意識したことを共有したいと思います。別途の記事でLAMP環境の構築方法とかvagrantのインストール方法を書きます。",[23,24,28,32,33,36,37,40,41,44,45,48,49,51,52,54],"div",{"className":25},[26,27],"alert","alert-success",[29,30,31],"b",{},"LAMP","とはOSが",[29,34,35],{},"L","inux系、Webサーバーに",[29,38,39],{},"A","pache、DBサーバーに",[29,42,43],{},"M","ySQL、サーバーサイド言語として",[29,46,47],{},"P","HP\u002F",[29,50,47],{},"erl\u002F",[29,53,47],{},"ythonのどれかを入れたサーバー環境のことです。\n",[56,57,59],"h2",{"id":58},"vagrantで仮想環境がお手軽","Vagrantで仮想環境がお手軽",[10,61,62],{},"まずプログラミングを習いたての方、例えばPHPを使ってDBと連携したり、JSライブラリのjqueryを用いてUIを学習するぐらいであればMAMPやXAMMPでOKです。ですがMAMPから次のステップに進むならばVPSやvagrantを用いてサーバーという物に触れた方が良いです。",[10,64,65],{},"VPSはお金がかかったりクラッシュさせると面倒なので、学習においてはvagrantがベストです。",[67,68,69],"h3",{"id":69},"vagrantとは",[10,71,72],{},"vagrantとはvirtual boxという仮想マシンを動かすためのツールです。仮想マシン、つまりMacのなかにWindowsの環境を構築したり、CentOS(商用のサーバーでよく使われるOS)を入れてサービスをリリースする環境を自分のPCに構築します。",[10,74,75],{},"仮想マシンを素で環境を構築しようとすると大変なので、vagrantというツールで「大体みんなこんな機能使うよね」という感じで設定してくれます。vagrantで構築するOSを指定すればあとはコマンドを使って自前サーバーを設定できるようになります。まあ、vagrant使えばVPSとか商用のサーバー環境を自分のPCで作れるんだなと思ってください。",[67,77,79],{"id":78},"どうして仮想環境が良いの","どうして仮想環境が良いの？",[10,81,82],{},"vagrantが良いのはdockerとは違って、実際のLAMP環境を構築する手順をローカルPC上で実演できるからです。最近はdockerでコードを書いてサーバー構築するという方法もありますが、それでもコマンドをポチポチ唱えてソフトやミドルウェア をインストールして..と構築する場面はまだ多いです",[10,84,85],{},"仮想環境なので例えミスって動かなくなっても壊して、再構築すれば良いだけです。そして仮想環境ですが、実際のサーバー構築と同じ動きをするのでサーバーのディレクトリ構成や、コマンド操作の練習が行いやすいです。",[10,87,88],{},"さらに言えば失敗できる環境なので、何かしらエラーが起きてそれを直してみるという経験は貴重です。サーバーでエラーということはwebページが全く表示されなかったり、サービスが停止する本番のサーバーでは失敗が許されません。その点を考えれば自由に失敗できる仮想環境は素晴らしいインフラ学習環境でもあります。",[67,90,91],{"id":91},"dockerだって失敗できるじゃないか",[10,93,94],{},"確かにdockerも同様に失敗できて、すぐに環境の再構築と破棄が可能です。しかしdockerを用いて環境構築するにはOSのディレクトリ構成とかApacheの設定の仕組みとかをインフラを最低限知っておかないと、ただの暗記コードを書くだけになります。",[10,96,97],{},"「このフォルダに〜〜の構成ファイルがあって、ここに設定しているのんだな〜」というのを理解するにはvagrantを用いて実際のサーバーを探検するのがベストです。",[56,99,100],{"id":100},"webサービスが提供される本質を知る",[102,103,104,108,111],"ul",{},[105,106,107],"li",{},"なぜ https:\u002F\u002F~~~~~とブラウザで検索するとwebサイトが見れるのですか？",[105,109,110],{},"ドキュメントルートとは何ですか？どこで設定できますか？",[105,112,113],{},"IPアドレス、ドメイン、ポートとはサーバーではどんな意味を持ちますか？",[10,115,116],{},"webサービスを提供するためにはインターネットに接続されたサーバーが必要です。ではサーバーに何をインストールして、何を設定して、どこにファイルをおけば自分が作ったアプリが実行され、他の人も使えるようになるのかをよく理解することです。",[10,118,119],{},"処理フローを追って、そしてインストールしたものがどのように相互作用しているのかを勉強するとインフラの知識の習得が早くなります。",[67,121,122],{"id":122},"まずはサーバーの基礎知識から",[10,124,125],{},"しかしインフラの知識がない中でソフトの相互作用とか全くわからないので、ソフトの前にサーバーの以下の知識を知るといいです。",[102,127,128,131,134,137,140,143],{},[105,129,130],{},"OS（どんな時に使われるのか、有料なのか無料なのか程度）",[105,132,133],{},"ディレクトリ構成",[105,135,136],{},"ディレクトリ内の役割（ざっくり）",[105,138,139],{},"権限とユーザー（大事です）",[105,141,142],{},"SSHの方法と接続",[105,144,145],{},"コマンドの意味",[10,147,148],{},"まずはこれは基礎知識です。PC何に接続したvagrantまたはリモート上のVPSとかに接続する方法、サーバーの中を探求するためのコマンドは知っておかないとまずサーバーをいじれません笑",[10,150,151],{},"私も「vagrantを構築したのはいいけど、仮想サーバーはどこにあるん？？」となってました。",[67,153,154],{"id":154},"ソフトウェア等をいれる",[10,156,157],{},"MAMPなどをインストールするとApache,PHP,Mysqlが入っていました。しかしvagrantで構築するとそれらは入っていません。自分でコマンドを唱えてインストールします。しかしそれらをインストールして稼働できるようになれば、webサービスを構築できます。",[10,159,160],{},"「vagrant \u003Cソフトウェア名> インストール」と検索して方法を調べましょう。",[56,162,163],{"id":163},"サーバー構築練習で意識すること",[67,165,166],{"id":166},"ググる際の注意",[10,168,169],{},"サーバー構築では絶対にエラーで悩みます。「Permission Deniedになる..」「PHPがインストールできない！」「500 Internal Server Error？もう知らん！」となるでしょう。エラーになった時は基本的にはググるのですが、そのググりの際に以下の点に注意しておくといいです。",[102,171,172,175],{},[105,173,174],{},"バージョンによる差異に気をつける",[105,176,177],{},"検索した記事の発行日時に気をつける\n-その記事では何をしたいのか？どんな問題を解決しようとしてるのか、前提条件を確認する",[10,179,180],{},"特にバージョンによる差異は要注意です。自分がインストールしようとしているバージョンと、記事内で解説されているバージョンには気をつけましょう。特に",[102,182,183,186,189,192],{},[105,184,185],{},"Apache2.2とApche2.4",[105,187,188],{},"CentOS6とCentOS7",[105,190,191],{},"MySQL5.7とそれ以前",[105,193,194],{},"PHP5系とPHP7系",[10,196,197],{},"こいつらには注意です。私もかなり苦労しました。バージョンごとに設定が大きく変わったりしているので、単に調べてコピペするだけでは解決しません。とりあえずどんなエラーが起きたのかログをメモして、バージョンに気をつけながら検索をしましょう。",[67,199,201],{"id":200},"まずはhelloworldhtmlを出してみよう","まずはHelloworld.htmlを出してみよう",[10,203,204],{},"ここでは主に勉強フローしか書いていませんが、",[102,206,207,210,213,216,219],{},[105,208,209],{},"vagrantとvirtual boxをいれる",[105,211,212],{},"OSを指定して仮想サーバーを立てる",[105,214,215],{},"必要なソフトウェア等をインストール",[105,217,218],{},"ドキュメントルート にHelloworld.htmlを入れておく",[105,220,221],{},"ブラウザでアクセスしてHelloworld.htmlを表示する",[10,223,224],{},"という流れができればインフラの理解はまず進みます。あとはセキュリティとか運用方法とか権限設定を学んでいくといいです。まずは最低限のインフラを整えて自分のwebサービスを表示・機能できるようにすると達成感と理解が半端じゃないです。",[56,226,228],{"id":227},"lampはオワコンとか言われるが気にするな","LAMPはオワコンとか言われるが気にするな",[10,230,231],{},"確かに最近はLAMP通りの環境ではなく、WebサーバーにNginx、DBはPostgreSQL、ていうか「Dockerでよくね？」「AWS上での構築でしょ！」とも言われて「LAMPは古い。オワコンだ」とも言われます。",[10,233,234],{},"しかし私が思うのはこれらの話は「あくまでより良いwebサービスを提供するための技術選定のお話」であってインフラのことを知っている人たちのお話だと思います。インフラ初学者にとって、基本と言いますか原理的な部分としてはLAMP環境でサーバーの知識を知った方が敷居が低いと思います。",[10,236,237],{},"多分LAMPほど情報が多く、チュートリアルで分かりやすい環境構築はさほどないと思います。LAMPからサーバーのことを知っていけば、AWSなりDockerなどLAMP以外の環境構築もすぐに理解できると思います。",{"title":239,"searchDepth":240,"depth":240,"links":241},"",3,[242,248,252,256],{"id":58,"depth":243,"text":59,"children":244},2,[245,246,247],{"id":69,"depth":240,"text":69},{"id":78,"depth":240,"text":79},{"id":91,"depth":240,"text":91},{"id":100,"depth":243,"text":100,"children":249},[250,251],{"id":122,"depth":240,"text":122},{"id":154,"depth":240,"text":154},{"id":163,"depth":243,"text":163,"children":253},[254,255],{"id":166,"depth":240,"text":166},{"id":200,"depth":240,"text":201},{"id":227,"depth":243,"text":228},[258],"learning","2020-07-12","md",null,{},true,"\u002Farticles\u002Fstudyflow-lamp-byself",{"title":5,"description":5},"articles\u002Fstudyflow-lamp-byself",[268],"infrastructure","_mix\u002Flamp.png","CKQOQrbqpmm4wvhwV_T8AhiuagWuX6LvExE6cLH8lcM",1780987141514]