Casual Developers Notes

初級・中級のエンジニアやデザイナー向けに技術情報と英語学習情報を提供中。エンジニアもデザイナーも技術と英語を身に着けて海外に飛び立とう!

  • ホーム
  • 技術 Tips & Tutorials
  • 技術塾
  • ライフハック
  • 海外留学
  • 英語学習
  • コラム
  • お問い合わせ

2017年12月27日 By Keid Leave a Comment

エンジニアやデザイナーとして海外を目指すならGitHubと英語学習を今すぐに始めろ!

エンジニアやデザイナーとして海外を目指すならGitHubと英語学習を今すぐに始めろ!

どうも、Keidです。久しぶりのコラムですね。今回言いたいことは、タイトル通り、エンジニアやデザイナーとして海外を目指すならGitHubと英語を今すぐ始めろ!ということです。これは海外企業で働いている日本人のエンジニアやデザイナーであれば全員賛同してもらえる意見だと思います。そんなの当たり前でしょ、と思った方はもうこの先を読む必要はありません。それ以外の方々に向けて説明します。

なぜ海外を目指すならGitHubなのか?

まず、日本人が日本企業に転職する場合と海外企業(現地企業)に転職する場合では面接官の見るポイントが異なります。日本と海外という文化の違いは多少ありますが、問題となるのはエビデンスです。

例えば、日本人のエンジニアが日本のA社からB社に転職しようとした場合、履歴書にA社での実績を記載し、B社の面接官はそれを見て評価してくれます。これは日本企業が履歴書をエビデンスとみなす傾向にあるからです。これ自体は何の問題もありません。

例えば、日本人のエンジニアが日本のA社から海外のZ社に転職しようとした場合、Z社の面接官は何をエビデンスとして評価するでしょうか?それは、履歴書、ポートフォリオ、電話による前の会社の上司の評価(リファレンスコール)です。ここで気づいてほしいのですが、リファレンスコールというのは英語でなければならないということです。そんなことが可能ですか?自分の上司は英語ペラペラですか?おそらく、一般的な日本企業であれば、上司は英語はほとんどできませんし、転職先から英語で電話がかかってくるなんて想像もできません。加えて、面接官は日本企業についての知識も無いため、履歴書の内容をどこまで信じてもらえるかは面接次第です。つまり、日本人のエンジニアが海外に挑戦するということは、履歴書とリファレンスコールが無い状態で就職活動をすることになりますから、現地の人よりもハードルが上がります。もちろん、ビザの問題もあります。

では、どうすればよいか?結論はポートフォリオを充実させて、見て分かる形で能力を証明することです。ポートフォリオとは作品集という意味で、要は実際に作ったものを見せる事を意味します。そこで、ポートフォリオを作る最も簡単な方法がGitHubという言うわけです。時間をかければ誰でも充実させられるので本当に簡単です。仮に入社1年目から初めて3年目に転職しようとした場合、3年分のエビデンスがすでにGitHub上にあるわけですから。本当に時間をかけるだけと言えます。

あなたはGitHubアカウントを持っていますか?アカウントを作ったまま放置していませんか?海外に行きたいという思いがあるなら、今すぐ始めることをオススメします。

今すぐ、この記事を読んだ後すぐに、です。

なぜ海外を目指すなら英語学習なのか?

そんな説明はいりませんね(笑)他の記事で英語の学習方法は書くとは思いますが、優先してやることは以下です。これらを地道にやっていれば、必然的に必要な英語の能力を身につけられます。

英語学習で優先すること

  • ボキャブラリを毎日増やし続ける(英単語の継続学習)
  • TOEICで800点台を目指す
  • GitHubを英語で書く(ReadMeを英語で詳しく説明する)

最後に

私は海外を目指した時に、英語もできず、GitHubもろくにやっておらず、苦労しかありませんでした。。。能力があったとしても証明する手段が無ければ評価はされないのです。知らなければ行動にはつながりませんが、この記事を読んだあなたは必要性に気づいたはずです。皆さんが私のようなミスを犯さないように計画的で安全な道を選んでくれることを願います。

カテゴリ : コラム タグ : english, github

2017年12月26日 By Keid Leave a Comment

MarsEditのつまずかない初期設定

MarsEditのつまずかない初期設定

ブログをWordPressにしたことで、記事作成ツールも新しくしてみたくなり、お高いMarsEditを導入してみました。いや、ほんと使いやすいですね、これは。しかし、導入時点でつまずいた点があったため、できるだけ私がやった通りの流れでつまずかない初期設定を紹介します。

そもそもMarsEditとは?

MarsEdit 4
MarsEdit 4
Download QR-Code
MarsEdit 4
Developer: Red Sweater Software
Price: Free+

主にプロブロガーの中で絶大な支持を集めている記事作成ツールで、現在価格が6000円もするお高いツールです。正直、機能に対して価格が高騰している感じはしますが、残念ながら代替となるツールが無いためこの価格でもほしい人はたくさんいる状況です。もちろん、私もその一人となりました。

では、そこまで高い買い物をして得られるメリットは何でしょうか?以下の3点が好まれている主な理由です。

  • ライブプレビュー(記事を書きながらプレビューが見れる)
  • ネット環境なしでも記事が書ける
  • 写真のアップロードが簡単にできる(実はこれが一番嬉しい)

これらは、Web上のエディタである程度の期間記事を書いたことがある人なら誰でも感じるあのモッサリ感、編集中にシステムエラーで書き途中の記事が吹っ飛ぶイライラ感、システムが勝手に変な編集をしてHTMLをぐちゃぐちゃにする失望感、、、などなどから解放してくれるということです。(Tumblrを使っていた時の不満です)

また、エンジニアの視点で見れば、開発環境を作る時にローカル環境でプレビューさせながらコーディングするようにするのはもはや常識なので、便利に決まっているのです。

初期設定

App StoreからMarsEditを購入し、ダウンロードしたという前提で説明します。まず、MarsEditを起動すると以下のダイアログが出るので、ブログ名とURLを入力します。

スクリーンショット 2017 12 24 16 42 08

その後で、自動設定が実行されるのですが、これは確実に失敗します。(軽いバグですね)出来が悪い感じですが、気にせずに進めます。

スクリーンショット 2017 12 24 16 42 17

そうするとメインのウィンドウが開くので、自分のサイトをダブルクリックして設定を開きます。

スクリーンショット 2017 12 25 0 49 19

あるいは、上部のメニューから「MarsEdit -> Preferences…」からでも設定を開けます。

スクリーンショット 2017 12 25 0 52 27

そして「Blog -> Connection」を選択し、以下の2箇所を設定します。

  • API Endpoint URL : https://yoursite.com/xmlrpc.php
  • Blog ID : 1

API Endpoint URLに設定するURLは、自分のサイトのURL(例えばhttps://yoursite.com/)の後ろに「xmlrpc.php」を足したものになります。これはWordPressのXML-RPCという仕組みを呼び出すためのものです。

スクリーンショット 2017 12 25 0 49 48

その後で「自分のサイト名 -> Refresh」あるいは上部の更新ボタンからリフレッシュします。

スクリーンショット 2017 12 25 1 02 16

すると、サイトのユーザ名とパスワードを聞かれるので、いつもWordPressにログインしている時と同じものを入力します。

スクリーンショット 2017 12 24 18 09 55

リフレッシュが成功し、今まで書いた記事が一覧に表示されれば初期設定は完了です。やっと使い始められます!

スクリーンショット 2017 12 24 18 11 02

トラブルシューティング

もし、この記事で説明している方法で初期設定が失敗した場合は、考えられる点は2つです。一つは、WordPressのプラグインによる問題、もう一つはレンタルサーバの設定による問題です。前者の場合は、プラグインを一つ一つ外して確認するしか手がありません。後者の場合というのは、レンタルサーバが独自でセキュリティ強化をしている場合で、具体的にはWordPressのXML-RPCにむやみにアクセスされないように権限設定をしていることがあります。

例えば、Xserver (Xdomain) の場合を紹介します。

どうしても設定うまくいかない場合に、自分のXML-RPCのURL(例えば、https://yoursite.com/xmlrpc.php)をブラウザで実行してみてください。すると、以下のように403エラーが出ている可能性があります。もしそうなら、レンタルサーバのセキュリティ設定の問題で間違いありません。もしかして海外からその作業をしていたりしませんか?日本のレンタルサーバは海外からのアクセスを制限するようにしていることがあります。

スクリーンショット 2017 12 24 18 02 48

海外からアクセスして使いたい場合の対処方法は、Xserver (Xdomain) の管理画面にログインし、「WordPressセキュリティ設定」を選択します。

スクリーンショット 2017 12 24 17 43 19

そして、以下の設定をオフにすれば解決します。ただし、注意書きにあるように、セキュリティが弱くなるため、自分で「.htaccess」ファイルを編集するか、セキュリティ強化のためのプラグインを導入することをオススメします。

スクリーンショット 2017 12 24 17 43 46

最後に

MarsEditの初期設定は成功しましたか?私は海外から初期設定を行ったためにトラブルシューティングに記載してある問題に直面して時間を無駄にしてしまいました。。。このブログを見ている方々は私の分まで時間を有意義に使ってくださいね。また、価格が高いと思われる方でもダウンロードは無料で、1カ月はお試しで利用できるので、試してみる価値はあると思いますよ。

環境

  • MarsEdit : 4.0.4
  • WordPress : 4.9.1

カテゴリ : ライフハック タグ : marsedit, wordpress, xserver

2017年10月8日 By Keid Leave a Comment

[Tutorial][Electron] Electronで文章を話すアプリを作ってみよう #5 ビルド編

[Tutorial][Electron] Electronで文章を話すアプリを作ってみよう #5 ビルド編

Congratulations!!ここまでお疲れ様でした。今回で最後です。前回までで「文章を話すデスクトップアプリ」の全機能は完成しました。残りはアプリを配布するために重要なトピック、そう、ビルドです。それでは、はじめましょう!

前回のおさらい

  • 英語は毎日コツコツ勉強するしかない
  • Electronのメニューバーは簡単にカスタマイズできる
  • ElectronはNodeJSと同じように環境を設定できる

1. Electronのビルドは必要?

今までElectronのアプリをどう実行していましたか?そうです。NPMのScriptsからelectronコマンドで実行していました。配布する上でこれは何が問題でしょうか?残念ながら、エンドユーザは大抵npm installなんてしれくれないですし、PCにNodeJSやGitは入っていないから実行できません。仮に開発者専用ツールなどでエンドユーザがエンジニアだったとしても、例えばMac上で作られたツールをWindows上で動かさなければならない場合は誰も使ってくれません。エラーが出るに決まってるからです。エラーを解析してプルリクくれる親切な人なら良いですが、大抵は違います。エラーを解析するより別のツールを捜した方が早いからです。

そこで、解決策として、Electronの実行環境を含めたパッケージとしてアプリを提供しようと言う訳です。パッケージ化する際にMacやWindows、Linuxなど配布する環境に合わせてビルドすることで、誰でも実行できるようになります。誰でも実行できるなら人気のアプリになるかもしれませんよね。

2. ビルドしよう!

2-1. 宿題の確認(アイコンの配置)

前回の宿題を覚えていますか?え?忘れた?廊下に立ってなさい(笑)秀才の方々はアイコンを準備していると思います。そのアイコンを以下の場所(プロジェクトフォルダ配下のassetsフォルダ)に配置してください。ファイル名はとりあえず「icon.icns」としましょう。

$ cd speak-sentences
$ mkdir assets
$ ls assets/
icon.icns

2-2. ビルドのためのツールのインストール

ビルドにはelectron-packagerを使います。このパッケージはwineというライブラリに依存しているため、先にそれをインストールしましょう。

$ brew install wine

次に、electron-packagerをインストールします。

$ npm install electron-packager --save-dev

これで準備はできました。

2-3. ビルドを実行してみる

まず、package.jsonにアプリ名(productName)を追加し、scriptsにビルドコマンドを追加します。

  "productName": "SpeakSentences",
  "scripts": {
    "electron": "NODE_ENV=development electron .",
    "production": "NODE_ENV=production electron .",
    "build":
      "electron-packager . --platform=darwin,win32 --arch=x64 --icon=./assets/icon.icns --out=./build --overwrite"
  },

今回はelectron-packagerで以下の設定をしました。

  • 対象のフォルダ: カレントディレクトリ(.)
  • アプリ名: SpeakSentences(package.jsonのproductName)
  • platform: MacとWindowsの両方対応
  • arch: 64ビット版
  • icon: 「./assets/icon.icns」のアイコンを使用
  • out: 「./build」フォルダに出力
  • overwrite: コマンド実行時に出力先のファイルを上書きする

それではコマンドを実行してみましょう。

$ npm run build

> speak-sentences@0.0.0 build /Users/username/workspace/speak-sentences
> electron-packager . --platform=darwin,win32 --arch=x64 --icon=./assets/icon.icns --out=./build --overwrite

Packaging app for platform darwin x64 using electron v1.7.6
Packaging app for platform win32 x64 using electron v1.7.6
Wrote new apps to:
build/SpeakSentences-darwin-x64
build/SpeakSentences-win32-x64

成功すれば、Mac用とWindows用のフォルダが作成されます。

$ ls build/
SpeakSentences-darwin-x64/ SpeakSentences-win32-x64/

2-4. 起動してみましょう。

ビルドで作成されたアプリを実行してみましょう。コマンドラインから実行していますが、単純にフォルダを開いてSpeakSentences.appをクリックしても起動します。通常のデスクトップアプリと同じです。

$ ls build/SpeakSentences-darwin-x64/
LICENSE                 LICENSES.chromium.html  SpeakSentences.app/     version
$ open build/SpeakSentences-darwin-x64/SpeakSentences.app

前回までで完成させた「文章を話すデスクトップアプリ」がプロダクション版で起動すれば成功です。

メニューバーがアプリ名になっています。アイコンを設定していればアイコンも設定したものなります。ここまでやると達成感がありませんか?いい感じです。

最後に

今回でこのシリーズは終了です。楽しんでいいただけましたか?Electronって楽しいですよね?ここで得た知識を活かして何か便利なアプリを作ったらコメントくださいね。

Next Step

実は、Electronにはもう一つ大事なトピックが残っています。そう、Reactなどのフロントエンドフレームワークとのインテグレーションです。本当はそこまで記事にしようと思ったのですが疲れてしまったので後は皆さんにお任せします。ここまで来た皆さんなら自力で実現できると思いますので、興味があれば調べて挑戦してみてください。

環境

  • OS: macOS Sierra 10.12.6
  • NodeJS: v8.4.0
  • NPM: 5.4.0
  • Electron: 1.7.6
  • electron-packager: 1.7.5
  • wine: wine-2.0.2

カテゴリ : 技術 Tips & Tutorials タグ : build, distribute, electron, tumblr-imported, tutorial

  • « Previous Page
  • 1
  • …
  • 33
  • 34
  • 35
  • 36
  • 37
  • …
  • 46
  • Next Page »

技術力と英語力を向上させて
あたなを次のステージへ引き上げるための無料メルマガ

Sponsored Links

About Author

Keid

カナダを拠点に活躍する(予定)デベロッパー。 大学でコンピュータサイエンスを真面目に学び、日本の大手IT企業に就職したまでは予定通りの人生だったが、日本のIT業界に失望したことで考え方が変わり、海外への挑戦を決意。海外に行きたくても英語ができなかっため、語学留学を経て強制的に英語を上達させ、カナダへの切符を手にした。このブログでは海外に挑戦したいエンジニアやデザイナーに少しでも有益な情報を提供していきたいと思う。(写真は旅行で行ったラスベガス)

https://casualdevelopers.com/

最近の投稿

  • 自作のNPMモジュールをsemantic-releaseを使って自動的にセマンティック・バージョニングで管理する方法

    自作のNPMモジュールをsemantic-releaseを使って自動的にセマンティック・バージョニングで管理する方法

    2019年2月15日
  • Go言語でさくっとREST APIを作ろう(Gorilla Mux編)

    Go言語でさくっとREST APIを作ろう(Gorilla Mux編)

    2019年2月4日
  • MacBook ProでApp Storeのアプリをアップデートする際に「This item is temporarily unavailable」と怒られた場合の対処法

    MacBook ProでApp Storeのアプリをアップデートする際に「This item is temporarily unavailable」と怒られた場合の対処法

    2019年2月1日
  • Go言語のためのVisual Studio Codeの設定方法

    Go言語のためのVisual Studio Codeの設定方法

    2019年1月28日
  • reCAPTCHAをWordPressに導入してロボットによるスパムメールを防ぐ方法

    reCAPTCHAをWordPressに導入してロボットによるスパムメールを防ぐ方法

    2019年1月25日

カテゴリ

  • 技術 Tips & Tutorials (85)
  • 技術塾 (5)
  • ライフハック (25)
  • 海外留学 (11)
  • 英語学習 (3)
  • コラム (7)

アーカイブ

最高の学習のために

人気記事ランキング

  • MySQLで「ERROR 2003 (HY000): Can't connect to MySQL server」と怒られた時の対処法
    MySQLで「ERROR 2003 (HY000): Can't connect to MySQL server」と怒られた時の対処法
  • [tips][Sublime Text] Sublime Text 3で文字化けしない方法
    [tips][Sublime Text] Sublime Text 3で文字化けしない方法
  • [tips][bat] バッチで明日の日付を計算する。
    [tips][bat] バッチで明日の日付を計算する。
  • Jupyter Notebookで「The kernel appears to have died. It will restart automatically.」というエラーが出た場合の原因と対処法
    Jupyter Notebookで「The kernel appears to have died. It will restart automatically.」というエラーが出た場合の原因と対処法
  • [tips][perl] Perlで文字コードをいい感じに処理する方法
    [tips][perl] Perlで文字コードをいい感じに処理する方法
  • データサイエンスのためのAnaconda環境構築とTensorflowのインストール方法(Docker編)
    データサイエンスのためのAnaconda環境構築とTensorflowのインストール方法(Docker編)
  • SpringBootのProfile毎にプロパティを使い分ける3つの方法
    SpringBootのProfile毎にプロパティを使い分ける3つの方法
  • SAKURAのメールボックスで独自ドメインのメールを設定し、Gmail経由で送受信する方法
    SAKURAのメールボックスで独自ドメインのメールを設定し、Gmail経由で送受信する方法
  • PythonでWebスクレイピング入門(Scrapy+Selenium編)
    PythonでWebスクレイピング入門(Scrapy+Selenium編)
  • Herokuの無料dynoをスリープさせないで24時間稼働させる4つの方法
    Herokuの無料dynoをスリープさせないで24時間稼働させる4つの方法

Bitcoin寄付

Bitcoinを寄付しよう

BTC
Select Payment Method
Personal Info

Donation Total: BTC 0.0010

このブログの運営のためにBitcoinでの寄付を募集しています。お気持ち程度の寄付を頂けると管理者の励みになります。

Bitcoin寄付について知りたい方はこちらの記事へ

ビットコイン取引ならここ

  • ホーム
  • 技術 Tips & Tutorials
  • 技術塾
  • ライフハック
  • 海外留学
  • 英語学習
  • コラム
  • サイトマップ
  • タグ一覧
  • プライバシーポリシー
  • お問い合わせ

Copyright © 2019 Keid - Casual Developers Notes