20200806のMacに関する記事は6件です。

【Python】macOSでpipを使えるようにする

ラズパイだとapt-getでpipがインストールできますが、macOSでpipをインストールしたく、そこで詰まってしまったのでその備忘録です。
Homebrewで一発とか思ってたのですが、brew install pipではインストールできません。1

公式ページのインストール方法に従う

公式のやり方に従って、以下のcurlコマンドで get-pipというPythonファイルがダウンロードします。

curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py

ダウンロードしたget-pip.pyを実行するとpipがインストールされます。

$ python3 get-pip.py

インストール完了

whichコマンドを叩いてパスが表示されるので、インストール自体は完了です。

$ which pip
/usr/local/bin/pip

環境

  • macOS 10.15.5 Catalina
  • pip 20.2.1
  • Python 3.8.5

参考サイト


  1. ※筆者はHomeBrewが大好きです。 

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

Mac のテキストエディットでHTMLコードを書いてみて つまずいた

超ハイパースペシャル初心者の“ぴおにあ”でーす:v:

この度、プログラムのプの字も分からない私は、ブロックチェーンでサスティナブルな仕組みを作りたい! という、その一心だけで無謀にもプログラムを学び始めることにいたしました〜〜〜:clap:イエーイ

そんな決意をした早々、Twitterのフィードに流れてきた超初心者用の全3回講座、しかも“いまだけ無料”に超惹かれ、そっこーで申し込み 興味津々受講してみましたよ✨

講師は 黒澤(わろさわ)先生 https://qiita.com/kurosawa_kuro

お題は、
【基礎学習 HTML編 〜HTML + CSS + JavaScript + FirebaseによるTodoアプリ〜】

内容は、
先生のお手本サンプルコードをテキストエディットにコピペして、拡張子を「.html」にして保存し、Chromeのタブにドラッグ&ドロップ!!!

という、非常に優しい(はずの)レクチャーでした。

わろ先生の兄弟弟子たちは以下参照
https://qiita.com/kurosawa_kuro/private/aab2426b0c434c453df1
 

ちな、私の環境は MacOS Mojave 10.14.6 です。

 
さて、テキストエディットを立ち上げて、わろ先生が用意してくれた超初心者向けの数行のサンプルコードをコピペして、
「ファイル」 ー 「保存… 」 と進みます。

拡張子を .html にして、デスクトップに保存(保存はどこでも大丈夫らしい)
そして、その書類をChromeのタブにポイッ!!! どやっ!?
 
  

そーなんです、ここでトラブル発生。。。
Chromeの新しく作成されたタブには、コードがそのまま表示されておりました。

スクリーンショット 2020-08-06 21.29.43.png

ほぇ?

 
 
 正しくは⇩⇩⇩こーなるはず。
スクリーンショット 2020-08-06 22.08.13.png

 
 
 
一見表面上は間違いはない。
テキストエディットの環境設定などをいくつか変更しても解決しません。
 
グーグル先生にお伺いを立て、いくつか調べるうちに判明したことは
 
「一部Macのテキストエディットは、デフォルトが“リッチテキスト”フォーマットになっており、そのままだと拡張子をhtmlにすることで自動的に裏でコードに変換してしまう(故に見たままをブラウザで表現される/できる)。 そうしないためには、テキストのフォーマットを“標準テキスト”に変更する必要がある。」
 
とゆー、有難くも時代の変革を感じさせる情報でした。

(もうプログラミングは自動変換されるほど当たり前に使用されているのね、、、) なーんて少し驚き、黄昏つつ、
おっしゃ! ますます取り残されないように学ばねば:fist: と気合が入ったのでした。
 
  
さて、それでは標準テキストに変換すれば良い! とドキュメントを一から作成し、最初の保存ページをみたところ、

スクリーンショット 2020-08-02 3.22.13.png

 
私は最初に、ここでフォーマットを「Webページ(.html)」を選択したのでした。
ここが、ある意味トラップ??  保存は一旦キャンセルして、
 
 
超初心者さんは、保存の前に以下のように「フォーマット」 ー 「標準テキストにする」 で変更をお勧めします。

Mac-texteditor_ss2.png
 

Mac-texteditor_ss3.png
 
 標準テキストに変更したら、安心して先ほどの 「ファイル」 ー 「保存…」 へ
 
Mac-texteditor_ss4.png
 
 そうすると、あら不思議、保存の画面が違います。
 
 
Mac-texteditor_ss5.png
 
 
 分かってしまえば、簡単なこと。
慣れたら、一回保存してから慌てずにリッチテキストフォーマットを標準テキストに変更もできるでしょう。
 
でも、超ハイパースペシャル初心者な私は、こんなことでも三時間ほど悩んでしまったのでした。
 
 (テキストエディットでなく、Cot Editor とか他のアプリ使えばいいじゃん、という意見は脇に置いて)
 
そんな私にわろ先生は、この経験をQiitaにまとめることを勧めてくださったのです⭐️
このまま わろ先生の素晴らしさを書き始めそうなので、それはまたの機会にして、、、。
 
今後Macのテキストエディットで躓く方がいないよう、また私の未熟な記録としてここに記載しておきます。
(いつか、こんな日もあったな〜、、、と懐かしむ日が来ますように、笑)
 
 
 

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

Vue CLI のインストールで躓いた場合

公式サイトのインストールコマンドを打ったのにインストールできない。

環境 : Mac OS Catalina 10.15.6
シェル : ZSH
nodenv : 1.3.2
node : v8.11.3

インストールコマンド

% npm install -g @vue/cli

エラーメッセージ

npm ERR! code E404
npm ERR! 404 Not Found: @vue/cli-ui@^4.4.6

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/whoami/.npm/_logs/2020-08-06T07_59_42_517Z-debug.log

解決方法

以前インストールした(インストール失敗した?)すべてのvue cliを削除します。

sudo npm uninstall --global vue-cli
sudo npm uninstall --global @vue/cli

最新バージョンをインストールします。

sudo npm install --global @vue/cli@latest

バージョンを確認

vue -V
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【インストール不要⁉︎】インストールする前に知っておきたいPythonの話

はじめに

ご覧いただきありがとうございます。
Pythonをインストールするにあたり調べながらやったところ、失敗しました。
Pythonはインストール方がたくさんあり、どれをどうすればいいのー?と調べれば調べるほど分からなくなります。
これからPythonを始める方にどの方法でインストールするのがおすすめか私なりにまとめてみました。

特にプログラミング経験がないがPythonをこれから始めたいと思っている方に有用な記事になるのではないかと思います。

Pythonをインストールする理由

macには標準でPythonがインストールされています。なぜあえてインストールするでしょう。
調べたり、知人に聞いたりして得られた理由が以下の2点です。

  • インストールされているPythonのバージョンが古いから
  • バージョンの管理ができないから

それぞれについて以下で詳しく解説します。

インストールされているPythonのバージョンが古いから

「macにはPython2が標準で入っているのでPython3をインストールします」といったPython3が標準で入っていないような記述を見かけることがあります。しかし、これは間違いで最近のOSにはPython3も標準で入っています
入っているものの、バージョンは3.7.3と少し古め(2020年8月6日時点で3.8.5が最新)。
新しい書き方を使用できないなどの不都合が生じる可能性があります。

バージョンの管理ができないから

標準でインストールされているPythonを使用している場合、使用するPythonのバージョンを自分で選択することができません。
そのため使用したいライブラリが標準で入っているバージョンをサポートしていない場合、OSの更新の際にPythonのバージョンが更新される、もしくはそのライブラリのサポートの範囲が広がるのを待たなくてはなりません。特にライブラリが古い場合、更新されていない可能性もありますよね。標準のPythonが前のバージョンに戻ることはほとんどないと思われるので使用を諦めなくてはいけなくなります。

また、新しいOSでPythonのバージョンが更新されると、自動的に使用するPythonのバージョンが変わることになります。新しいバージョンになると新しい文法が使用できるようになるのと同時に、今までの文法が使用できなくなる可能性もあります。そのため、アプリを開発している途中でPythonのバージョンが変わってしまうとエラーの原因になる可能性があります。

これらがあえてPythonをインストールする理由です。

Pythonをインストールする方法

すでに述べたようにPythonのダウンロード方法はいくつかあります。

  • 公式ページから
  • Homebrewの使用
  • pyenvの使用

それぞれの方法について解説していきます。

公式ページから

image.png
Python公式ページダウンロードページから直接ダウンロードします。そのままですね。
詳しいインストールの方法はこちらの記事を参考にするといいと思います。

この方法でのインストールをおすすめする方

  • Windows使用者の方
  • ターミナルを使用せずにインストールしたい方

インストーラーでインストールすることができるので、視覚的に分かりやすいです。
これ以降に説明する方法はターミナルの操作が必要です。プログラミングをこれから勉強しようと思っている方にとってターミナルの使用は壁が高く感じるのではないでしょうか?そのような方に向いている方法だと思います。
私はWindowsを使用していないので詳しくは分からないのですが、調べているとWindowsの方はこの方法でインストールするのが一般的なようです。

Homebrew?

HomebrewとはmacOS・Linux向けのパッケージ管理システムです。
macOS・Linux使用者向けですがWindows使用者の方でも使用できるようです。
ターミナルに以下を打ち込むことで簡単にインストールできます。

// Homebrewのインストール
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

// Pythonのインストール
brew install python3

HomebrewでPythonをインストールし環境構築を行う場合こちらの記事が参考になると思います。

この方法でのインストールをおすすめする方

  • 最新のバージョンのPythonを使用したい方

Homebrewではバージョンの指定をせずにインストールすることが可能です。
最新のバージョンを使用したい方にとって上の2行をターミナルにコピペするだけですむこの方法が一番楽だと思います。
またPythonのバージョンのアップグレードも簡単に行えます。
Pythonのバージョンアップグレードの方法

pyenv

pyenvとはPythonのバージョンの切り替えを簡単にしてくれるツールです。
PC全体で使用するPythonのバージョンだけでなく、フォルダごとにバージョンを分けることも可能です。
pyenvを使用してPythonをインストールする方法を以前書きましたので、よろしければこちらをご覧ください。

この方法でのインストールをおすすめする方

  • チームで開発を行う方
  • 複数のアプリの開発を行う方

このインストール法をおすすめする方は、Pythonのバージョンを切り替えたい方です。例えばチームで開発を行っていて開発環境を合わせたい、複数アプリの開発を行っていて切り替える必要があるなどです。新しいバージョンのPythonには新しい文法(新しい書き方)が加わると同時に今までの書き方がサポートされなくなる可能性があります。今まで作成したアプリにサポートされなくなる文法が使用されていると、バージョンの更新と同時にいきなり動かなくなってしまいます。使用するバージョンを切り替えることでそのようなエラーを防ぐことが可能です。

これからPythonをはじめる方におすすめする方法

これはmac使用者の方に限られてしまうのですが、ここまで調べて私が思うおすすめの方法はインストールしない!です。
環境構築は難しいです。環境構築とGoogleにうちこむと難しいと予測変換で出てくるほどです(笑)
よく分からないままインストールしていると、別の方法でインストールされたPythonが複数存在することになってしまいわけがわからなくなります。
標準でインストールされているPythonのバージョンもそこまで古くないので、とりあえずPythonに触れてみるのがいいのではないかと思います。

pythonのバージョンを確かめる方法

python3 -V  or python3 --version
 =>Python 3.7.3

python -Vとしてしまうと2.o.oのようにPython2のバージョンが出てきてしまうので注意してください。

最後に

これまでpyenvを使用している方が多く、バージョンの管理もしやすいならpyenvを使うのがベストプラクティスなんだと思っていました。
しかし、新しいバージョンで今までの文法がサポートされなくなることは頻繁にあることではないと思います。
また、ライブラリのバージョンアップでサポートするPythonのバージョンが古いほうに伸びるということもあるようです。Python3がmacに入っていないという記述や、bash使用者向けの記事が今でも多いことなどから今までのやり方を続けている方が多いのかもしれません。

Pythonを勉強し始めてまだ2週間ほどなので理解できていないところも多々あります。
間違い等ありましたらご指摘おねがいします。最後までご覧いただきありがとうございました。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

MacでM5StickCの開発環境構築から書き込みまで

環境

  • Mac OS Catalina 10.15

参考情報

M5 Stick C本体 | SWICH SCIENCE
https://www.switch-science.com/catalog/5517/

M5 Stick C公式ドキュメント | M5 Stick C 概要
https://docs.m5stack.com/#/en/core/m5stickc

M5 Stick C公式ドキュメント | Arduino クイックスタート
https://docs.m5stack.com/#/en/arduino/arduino_development

Github | M5 Stick Cソースコード
https://github.com/m5stack/M5StickC

手順

USB Driverをダウンロードする

クイックスタートのドキュメントを開く。
https://docs.m5stack.com/#/en/arduino/arduino_development?id=usb-driver

Macを選択すると、ダウンロードが始まります。

スクリーンショット 2020-08-06 10.09.44.png

USB Driverのセットアップ

ZIPを解答してdmgを開くとダイアログが開くので、pkgファイルを開く。
スクリーンショット 2020-08-06 10.10.49.png

「続ける」をクリックし、インストール完了まですすめる。
スクリーンショット 2020-08-06 10.10.51.png

下記が表示された場合は、環境設定でセキュリティとプライバシーを開く。
スクリーンショット 2020-08-06 10.12.21.png

「開発元"Silicon Laboratories Inc"…」で「許可」をクリックする。
スクリーンショット 2020-08-06 10.12.41.png

arduino IDEをダウンロードする

ダウンロードURL
https://www.arduino.cc/en/main/software

HOURY版のMac OS Xを選択すると、ダウンロードが始まる。
スクリーンショット 2020-08-06 9.17.03.png

arduino IDEのセットアップ

arduino IDEを起動して、「File > Peferences > Settings」を選択する。
「追加のボードマネージャのURL」に下記をコピペする。
https://dl.espressif.com/dl/package_esp32_index.json

スクリーンショット 2020-08-06 10.47.30.png

「Tools > Board > Boards Manager...」を選択する
ESP32を入力して、検索結果の"esp32"をインストールする。
スクリーンショット 2020-08-06 10.52.26.png

「Tools > Board > ESP32 Arduino > M5Stick-C」を選択する。
スクリーンショット 2020-08-06 10.54.55.png

「Sketch > Include Library > Manage Libraries...」を選択する。
M5StickCを入力して、検索結果の"M5StickC"をインストールする。
スクリーンショット 2020-08-06 11.01.26.png

arduinoでM5StickCに書き込みする

M5StickCとMacをUSBで接続する。

ツールの設定を下記にする。

設定名 設定値
ボード M5Stick-C
Upload Speed 1500000
Partition Scheme 初期値
Core Debug Level なし
シリアルポート /dev/cu.usbserial-***

(設定例)
スクリーンショット 2020-08-06 15.17.15.png

サンプルで提供されているスケッチを選択する。
今回はRCTを選択。

スクリーンショット 2020-08-06 15.25.26.png

エディタ左上の書き込みボタン(→)をクリックする。

スクリーンショット 2020-08-06 15.43.03.png

Arduinoのエディタに、下記のメッセージが表示されれば書き込みは正常完了です。

Leaving...
Hard resetting via RTS pin...

書き込み完了したM5StickCの動作。
(RIP Hat装備状態)
IMG_0180.jpg

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【node.js】 node.jsインストール 芋っていたけど、簡単だった件...

【ゴール】

node.jsを自身のPCインストール

【目次】

■node.jsとは

■インストール

■確認

■実際にファイルを作成,node起動

【環境】

■ Mac OS catalina
■ node v12.18.3
■ npm v6.14.6

【開始】

node.jsとは

■サーバーサイドで動くjavascriptのライブラリ
■動きが早い
■チャットや同時に多数の接続があっても耐える
■npmも同梱とお得。

インストール

下記の公式ページへ。
https://nodejs.org/ja/download/

*OSによって異なるので注意。
*確認事項ありますが、全て確認し、進めてください。

確認

実際にPCにインストールされたか確認

■node.jsのバージョンを確認

mac.terminal
$ node -v
v12.18.3

■npmのバージョンを確認
*npmとは「node package manager」の略。nodeのマネージャーさんですね。

mac.terminal
$ npm -v
6.14.6

実際にファイルを作成,node起動

■Descktopに適当にディレクトリ作成
■その中にファイル「index.html」「index.js」を用意

mac.terminal
$ cd Descktop
$ mkdir JS
$ cd JS 
$ touch index.html
$ touch index.js

■node.jsのローカル環境を起動

mac.terminal
$ npx @js-primer/local-server

■html/jsファイルに追記

index.html
<p>hello.</p>
<script src="index.js"></script>![スクリーンショット 2020-08-06 12.10.24.png]
index.js
conole.log('hello,world');

すると....

スクリーンショット 2020-08-06 12.12.20.png

以上。
あとはフレームワーク等使用すればいいですね。

【合わせて読みたい】

■ 【comandLine】 一言で コマンドライン 各種コマンド ターミナル
https://qiita.com/tanaka-yu3/items/b32e353bd6d7c9ebd4fb

■ 【javascript】 テンプレートリテラル とは 一言で。
https://qiita.com/tanaka-yu3/items/9b07bd9fc4126291be28

■アプリケーション開発の準備 · JavaScript Primer #jsprimer
https://jsprimer.net/use-case/setup-local-env/

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む