はじめに伝えたいこと
ここ3日間ほど、Carkuruの開発を再始動させていました。
実際Carkuruを作っている中で、どういった技術を使って、どういう流れで作っているのか？
そういったものをログの意味も含めて、記事にしておこうと思いました。
実際にスタートの時点から、様々な試行錯誤はあったものの、現在はfixをかけて制作にひたすら打ち込む日々になっております。
参考にしたサイト
今回DjangoではAPIの機能として、バックエンド側にだけ使用する形で採用しました。
フロントエンドはReactを使って開発しています。
今回制作する上で、非常に参考にした上に、参考になったサイトがあるので、紹介します。
ここは本当にお世話になりました。
すべてがここで完結しているわけではないのですが、僕なりの躓きポイントも交えながら、現在のCarkuruがどうやって出来ているのか、そして何を目的に作っているのかを交えながらお話していければいいなと考えております。
ドメインは早めに取りましょう
サービスインするときに、『ドメイン名取られてるわ・・・』これってすごく悲しいの。
だから、早めにドメインは取得しておきましょう。
なんなら、サービス考案した時点でドメインだけでもいいから取得しましょう。
サービス名をつけると急にやる気出てくるし、それだけでサービス始まった感じが出るのでオススメです。
僕も今まで幾度となく、サービス名をつけて始めようとして、クローズしたサービスが80を超えます！
ちなみに、リリースまでこぎつけたものは、2つです。(草生える)
ドメインを取得したら、サーバーは後回しでいいかな。と僕は考えています。
ちなみに、今回もLPをリリースするがためにサーバーを借りるということはしておらず、普段利用しているこのブログと同じサクラのレンタルサーバーにLPだけ一旦配置しようと考えています。
インフラに関しての知識は皆無に等しいので、勉強しながらこの開発も進めていきたいと思います。
ローカル環境を作りましょう
ローカル環境ってなんだよ？という人も含めて今回の記事のターゲットなので、記載しておきます。
いわゆる全世界に公開する前の開発環境を自分のパソコン/Mac内に作る/構築することを指します。
お金かからないし(パソコン/Mac買う金はかかるけど)、定期的な支出は0円なので非常に便利です。てか、必須です。
1つだけ欠点がありまして、パソコン/Macが破損した際にデータは全て消えます。
なので、対策のためGitHubなどのコード管理サービスを利用しましょう。
使い方は後ほどお伝えします。知ってるわボケなピーポーは読み飛ばしてね！
実際にローカル環境を使うときの技術
pipenvという技術を使って、今回ローカル環境を構築します。
pipという技術が今まで主流だったらしいけど、なんかこっちの波来てるから乗るしかないでしょ。というノリです。
pipenvの他に、homebrewとか、色々と必要らいし自分も入れてますけど、まずはDjangoを構築するために必要なものから入れていきましょう！
と言った矢先に、Pythonのバージョン管理できればしたいから、それだけはまず入れようか・・・。
Pythonは自分で入れ加えてあげたほうがGOOD
この記事が非常にわかりやすく記載してくれています。
こういった記事ってたくさん出てくるけど、Qiitaの場合は、『とにかく今日の日付に近いものを見る』を心がけると比較的変なエラーに遭遇する機会が減ります。
Xcodeをインストールしないと、そもそもPyenvという今回Pythonのバージョンを管理するモノを入れられないので、そこから始めましょう。重複する部分であったり、Qiitaのページに行かなくても済むように、こちらにも記載しておきます。
Xcodeをインストール
まず、(iTermというアプリのほうがおすすめだけど)Terminal.appを開いて、
user@host $ xcode-select –install
のxcode-select –installこの部分を入力しましょう。
それ以前のuser@host $は入力しなくていいです。すでに画面に表示されている文字も含めて記載してあるだけですので。
その後こちらを入力
xcode-select –print-path
/Applications/Xcode.app/Contents/Developer
こういったものが表示されるかもしれません。『ふーん』と思っておけばいいでしょう。とりあえずね。
万が一別画面で変なウィンドウ出てきたら、installボタンをクリックしてあげればGOODです！
Homebrewをインストール
こちらのサイトにいきまして、
この白い字で記載されている部分をコピーして、Terminal.appに貼り付けて、実行してあげましょう。
/usr/bin/ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)”
この部分ですよ。
一連のインストールが終わったら、『brew doctor』と入力して実行しましょう。
Your system is ready to brew.と表示されたら、GOODです！
できれば、brew updateと入力して実行、Already up-to-date.と表示されればGOODです！
たまにはアップデートもかけてあげないとね。
いよいよPyenvのインストール
brew install pyenv
こちらをTerminal.appで入力して実行しましょう。
インストールが終わったら、以下の文章を(bash/zshそれぞれ置き換えてください-僕はzsh派ですが)、貼り付け！
cat << ‘EOS’ >> ~/.bash_profile
export PYENV_ROOT=/usr/local/var/pyenvif which pyenv > /dev/null; then eval “$(pyenv init -)”; fi
EOS
source ~/.bash_profile
このまんまコピーして貼り付けでGOODです！
Pyenvのバージョン確認をしておきましょう。
pyenv –version
僕のはpyenv 1.2.5と表記されています。
後々入れると、1.2.6とか1.3.0とかわからないけど、上記の数値より大きい値が入ってるかもしれません。
いよいよ、Pythonを新規で追加しましょう。
pyenv install –list
このコマンドでいま新規で追加できるPythonのバージョンをリストで確認することが出来ます。
僕は3.7.2を入れているようです。
しかし、現状3.7.3のほうが良さそうなので、3.7.3を入れましょう。
pyenv install 3.7.3
そして、普段使うPythonを今インストールしたものに設定するために、下記のコマンドを実行します。
pyenv global 3.7.3
pyenv versions
これで
- 3.7.3 (set by /usr/local/var/pyenv/version)
と出てくればGOOD！
python –version
と入力したら、
python 3.7.3
と出てくれば完璧です！
Pipenvをインストールしましょう
python -m pip install pipenv virtualenv
追加で変なもの(virtualenv)とか入れていますが、こちらも仮想環境(ローカルの開発環境)で必要・・・だったと思うので入れておきましょう。
開発環境の下準備が出来たら、コード書こうな？
コード書こうな？とかどこのどいつがほざいてるんだか・・・。
コードをいきなり書くととんでもないことになるのはわかっていながらも、書きたくてたまらなくて、書き始めちゃう輩がこちらにおります。
といっても、紙に書いたほうがいいことは確かなのですが、一旦下地だけ作っておこうと思います。
Django入れておきましょう。
pipenvで仮想環境構築
まずは、自分のパソコン/Macに作業フォルダを作りましょう。
僕は『/Users/自分のパソコンの名前/ここに作る』ことが多いです。
今回はCarkuruというフォルダを作ります。実際使っている名前は違うけど・・・。
そうしたら、そのフォルダにターミナル/iTerm上で移動した上で、
pipenv –python 3.7.3
と入力しましょう。
ちなみに、僕が使っているエディタはVisual Studio Code(以下VSCode)というアプリです。
先程作ったCarkuruフォルダを、VSCodeで開くとPipfileというファイルが出来ています。
これでGOOD！
あとは、ひたすら必要なプラグインをインストールしていくだけです！
の前に！仮想環境に入りましょう。
pipenv shell
とTerminal/iTermで入力すると、一番左側に今回だと(Carkuru)と表示されるはずです。
その状態で、
pipenv install django
これでDjangoはインストールされます。
これでGOOD！
仮想環境に毎回はいってあげれば、環境を切り分けたりすることが出来て、環境をきれいに管理できます。
美しい！ぶーてぃふる！
いよいよ、Djangoでプロジェクト開始！
Terminal/iTerm上で、
django-admin startproject config .
と叩いて実行です！最後のピリオドも忘れずに入力してあげてください。
そうすると、Carkuruフォルダの中にconfigというフォルダが出来ましたね！
configという部分は自分の好きな名前『mysite』とかでもいいのですが、僕は今回『config』という名称で構築しています。
そうしたら、その場で
python manage.py runserver
と叩いて実行します。
http://127.0.0.1:8000/
このアドレスにブラウザでアクセスすると、Djangoのデフォルトページが表示されます。
これでGOODだね！
Carkuruの現状
CarkuruはバックエンドをDjangoでAPI化してあげております。
まずはDjangoにアクセスするところから何度となく挫折しながら、現状にたどり着きました。笑
1つ1つメモしておかないと忘れる頭なので、ログとしてちょっとずつ残していければいいなと考えております。
Reactでフロントを書いておりますが、まだ学習途中なので、未熟ですがリリースに向けて、走り続けたいと考えています。
最後にクラウドファンディングもやっておりますので、支援お待ちしております！
