開発環境のメモ

2019-11-02

ハードウェア

PC：GALLERIA XF

  • ドスパラで2019年6月に購入。22.9万円
  • CPU: Intel Core i7-9700K 3.60GHz, 8コア8スレッド
  • GPU: NVIDIA GeForce RTX 2070
  • メモリ:32GB
  • SSD: 500GB
  • HDD: 2TB

OS ： Windows 10 Pro

  • バージョン：10.0.17763 ビルド 17763
  • 個人用に設定
  • 回復ドライブ
    • 32GB USBメモリ（あえてUSB2.0規格）

ブラウザ

Google Chrome

Brave Browser

IME：Google 日本語入力

エディタ

Visual Studio Code

  • 1.35.1

ESLint （JvavaScriptの構文チェック）

TSLint （TypeScriptの構文チェック）

Japanese Language Pack for VS Code（VSCodeを日本語化）

Live Server （ページを自動リロードする開発ローカルサーバー）

Mithril Emmet （HTML等の入力補完）

PlantUML （テキストファイルでUML描画）

vscode-spotify （VSCode内でSpotifyを使用）

DotENV （.envの文法のハイライト）

設定

  • [ファイル] – [自動保存]をチェックする
  • 設定のterminal.integrated.shell.windowsをsetting.jsonで”C:\Program Files\PowerShell\6\pwsh.exe”に設定したPowerShell Coreに変更する。
{
     "terminal.integrated.shell.windows": "c:/Program Files/PowerShell/6/pwsh.exe"
}

SSHキーの設定

  • 以下などで使用するためSSHキーを設定する。
    • Bitbucket
    • GitHub
    • Cyberduckを介したXSERVERとのFTP-SSL
    • GitHub Desktop
    • Heroku

Git for Windows

  • インストールの設定は基本デフォルト。ただし、[Choosing the default editor used by Git]ページで[Use Visual Studio Code as Git’s default editor]を選択。

バージョン管理

  • 以下などで使用するためSSHキーを設定する。Bitbucket
    • GitHub
    • Cyberduckを介したXSERVERとのFTP-SSL
    • GitHub Desktop
    • Heroku
  • 同時にインストールされるGit Bushにて、SSHの鍵を作る。
    • 任意のフォルダ以下に.sshフォルダを作る(“.ssh.”と入力）
    • 任意のフォルダにて以下を実行し、.sshフォルダの下に2つのファイルを生成させる。パスフレーズはXSERVERを考慮して、なしではなく、半角英数字、半角スペース、その他一部記号を用いて6～32文字で設定する。
ssh-keygen -t rsa  -b 4096 -C "your_email@example.com"
  • SSHエージェントが実行されているかのは以下のコマンドでおこなう。
 ssh-add ~/.ssh/id_rsa 
 eval "$(ssh-agent -s)"
  • 新しいSSH秘密鍵ファイルをSSHエージェントに追加するには以下のコマンドでおこなう（Linux及びWindows）。
 ssh-add -K ~/.ssh/id_rsa

Sourcetree

  • Bitbucketのアカウント等が要求される。
  • GitHubのリポジトリを使用する場合は、先にGitHubにSSHを登録しておき、[ホスティングアカウントを設定]ダイアログボックスにて下記設定をした上で、[OAuthトークンを再読込]ボタンをクリックして、GitHub側で[Authorize atlassian]ボタンをクリックする。
    • ホスティングサービス：GitHub
    • 優先するプロトコル：HTTPS
    • 認証：OAuth

GitHub Desktop

  • GitHubをWebサイトでなくElectroを用いたネイティブアプリで使うもの。
  • GitHubのアカウントとパスワードが必要。
  • https://github.com/settings/keys で、SSHを登録する。

シェル

Git Bash

  • Git for Windowsのインストールにより既にインストールされている。

PowerShell Core

  • 6.2.1
  • バージョン確認方法
 PS> $PSVersionTable

デプロイメント

FTP、SFTPファイルアップロード

Cyberduck

  • [新規接続]ダイアログボックスでは、FTP-SSL (Explicit AUTH TLS)を選択する。SFTP(SSHによる暗号化FTP)ではない。
  • 無料だけど$10以上払って登録しないと、毎回寄付をつのられる。

アプリケーション・デプロイメント・プラットフォーム

The Heroku CLI

  • Herokuアプリの作成と管理をターミナルから行うことができるコマンドラインインターフェース(CLI)。
  • これをインストールする前に、Herokuのアカウントを作成する必要がある。
  • インストール後に、以下でバージョン確認とログインができる。
> heroku -v
> heroku login

コミュニケーション

Line

  • デスクトップアプリケーションをインストール

Slcak

  • mohikan
  • デスクトップアプリケーションをインストール

WordPress

JavaScrit関連開発

Node.js

  • JavaScript をブラウザ外（サーバーサイドなど）で実行できる環境。npmを含む。
  • 推奨版と最新版があるが、推奨版をインストール。
  • バージョン確認は以下
node --version

TypeScript

  • Node.jsインストール後にnpmでインストールする。
npm install -g typescript
  • バージョン確認は以下
tsc --version

データベース

Mongo DB

  • こちらからダウンロード(Windows, 64bit, zip)
  • 伸張したら、次のコマンドが実施できるように配置し、データを置くフォルダを作成する。
C:\Users\pitan\Documents\GitHub\node-course> /Users/pitan/mongodb/bin/mongod.exe --dbpath=/users/pitan/mongodb-data

Robo 3T

  • MongoDBのGUI。以前Robomongoと呼ばれていたもの。
  • 他にStudio 3Tという製品もある。
  • Windows 64-bit, exe形式をダウンロード、実行してインストールする。
  • Mongo DB Connections
    • Createをクリックする
    • Name: Local MongoDB Database
    • [Save]をクリックする
  • 以下の右クリックメニューから[Open Shell]を選択し、”db.version()”と入力し、緑色のボタンをクリックするとバージョンが表示される。
Robo 3T

MongoDB driver for Node.js

npm init -y
npm i mongodb@3.1.10

Mongoose

  • アプリケーションデータのモデル化と管理を容易にする。
  • これにはデータのサニタイズ（無毒化）やデータバリデーション他を含む。
  npm i mongoose@5.3.16

MongoDB Atlas 及び MongoDB Compass

  • [Conect to Cluster0]画面では[Connect with MongoDB Compass]を選択。
  • mongodb+srv://pitang1965:<password>@cluster0-fqzuj.mongodb.net/test　みたいなURI Conection Stringをコピーしておく。
  • ローカルホストのDBの接続設定
    • 基本デフォルトを受け入れるが、[Connect to Host]画面の[Favorite Name]は、適当に”Localhost MongoDB Database”などと設定し、ローカルへの接続をまず最初に設定する。
    • [Connect]ボタンをクリックしたときに、mongod.exeが起動していないとECONNREFUSEDエラーが出る。
  • 本番環境のDBの接続設定
    • [Connect] – [Disconnect]を選択した後に、[New Connection]を選択し、本番環境のDBへの接続設定をおこなう。
    • 上記の” cluster0-fqzuj.mongodb.net”の部分の文字列を[Hostname]に設定する。
    • [SRV Record]をONにする。
    • [Authentication]を[Username / Password]にする。
    • [Username]と[Password]を設定する。
    • [Favorite Name]を”ProductionMongoDB Database”などとする。

REST API

Postman

  • HTTPリクエストを行うためのツールセットを提供することにより、REST APIのテストを簡単にする無料ツール。

テスト

Jest

Mocha

デザイン

プロトタイピング

Adobe XD

カラーピッカー

Color Picker

  • スクリーンを対象としたスポイトツール HTML/RGB/HSV/Delphi形式などの色値を取得

その他

クラウドストレージ

Google One（Googleドライブ）

  • こちらのパーソナル（バックアップと同期）をダウンロード

BGM

Spotify

オフィス

LibreOffice

  • あまり使わないからインストール時にクイック起動は外す（カスタムインストールにて）

Fitbit開発

Posted by pitang1965