Go1.11から実験的に導入された
syscall/jsパッケージでJavaScript側の操作も可能
GOOS=js GOARCH=wasmでgo buildすると.wasmファイルが生成される
テストもGOOS=js GOARCH=wasm go test -exec="$(go env GOROOT)/misc/wasm/go_js_wasm_exec"のようにexecで実行環境を渡してあげれば可能

詳しくはこちらを

github.com

構造

ディレクトリ構造

.
├── background
│   ├── background.js    // 新しいタブでPlaygroundを開く
│   ├── formatter.go     // フォーマットする関数を生成・登録
│   ├── init_go.js       // Goのインスタンス生成
│   └── wasm_exec.js     // Go + wasmを実行
├── contents
│   └── contents.js      // 選択した文字列をChromeAPIでbackground.jsに送る
└── manifest.json

全体の流れ

f:id:ramenjuniti:20190625011556p:plain — 全体の流れ

簡単な図はこんな感じです

注意

wasmを利用する場合manifest.jsonに

"content_security_policy": "script-src 'self' 'wasm-eval'; object-src 'self'"を追加しないといけないみたい

つらみ

formatter.wasmのサイズが3.7MBで、すごくでかくなってしまった。

Go + wasmではここらへん問題はまだまだあるみたい

まとめ

GoでChrome拡張は作れる
Goでしかできないことをブラウザに持ち込める
まだまだ課題もある

みなさんも是非、GoでChrome拡張を作ってみてはいかがでしょうか

では

2019-06-09

MojavaでCaboChaをPythonバインディングしようとしたらエラーが出た

自然言語処理 Python

CaboChaをPythonで使えるようにする際に詰まったので、その解決方法を備忘録として残しておきます。

何がおきたか

以下のようにCaboChaのPython バインディングをインストールしようとした際に、

git clone https://github.com/taku910/cabocha
cd cabocha
pip install python/

このようなエラーが

Failed building wheel for cabocha-python

色々見てみると原因発見

ld: library not found for -lcrfpp

どうやらcrf++が見つかんなかったみたい。

解決方法

qiita.com

こちらの記事を参考にしました。

crf++ の場所をパスに追加します。

export LIBRARY_PATH=/usr/local/Cellar/crf++/0.58/lib

そしてもう一度CaboChaのPython バインディングをインストールすると

Successfully installed cabocha-python-0.69

成功！やったぜ！

2019-04-29

選択した文字をそのままThe Go playgroundで実行してくれるchromeの拡張機能を作った

Go chrome-extension JavaScript

タイトル通りです笑

作ったもの

Clip Goって名前で公開しています

chrome.google.com

動作はこんな感じ

f:id:ramenjuniti:20190429031957g:plain

選択した文字をそのままThe Go Playgroundに貼り付けて実行します

コード自体はこちら

github.com

作った理由

qiitaやブログなどに載ってるgolangのコードを実行したい時に、playgroundをいちいち開いたりするのがただただ面倒だったから笑

審査

今回初めてchromeの拡張機能を公開したのですが、審査に3日ぐらいかかりました😅

どうやら2018年10月からGoogleは悪質なChrome 拡張機能への対策として審査の厳格化などを行なっているみたいですね

拡張機能のpermissionsを絞ればもう少し早く公開できたかもしれません

作ったものがすぐ公開できなくて自分的にはモヤモヤしましたが、こればっかりはしょうがないですね

ではまた

2019-04-21

技術書展6に行ってきました

日記

どうも

タイトルの通り今年も行ってきました

techbookfest.org

わーい pic.twitter.com/yi6YtUEA7A
— ramenjuniti (@ramenjuniti) 2019年4月14日

技術書展5の記事はこちら ramenjuniti.hatenablog.com

開場前

前回は昼過ぎからの参加でしたが、今回は開場前10時過ぎぐらいに到着しました。（開場は11時から）

しかし既に長蛇の列😇

#技術書展6 列長すぎて建物の端の方まで来た
— ramenjuniti (@ramenjuniti) 2019年4月14日

11時から13時までは入場料1000円を払わなければならないのですが、それでも3000人以上は並んでいました。

開場後

ディズニー並のすごい人でしたが、前回の反省を元に買うものリストをあらかじめ作っておき、売り場も把握していたので、目的のものはスムーズに買えました。

前回興味があるもの全て買ったはいいものの、未だに読めてないものなどもあるので、今回は買い過ぎには注意し、必要だなと思うもののみを買いました。

買ったもの

techbookfest.org

golangばっかですね笑

せっかく色々買ったので、しっかり読んで知識を身につけようと思います

ではまた

2019-03-19

サポーターズ1on1面談イベントに参加した

日記

表題の通りサポーターズのエンジニア向けイベントに行ってきました！

逆求人なるものにきた
— ramenjuniti (@ramenjuniti) 2019年3月17日

サポーターズとは

supporterz.jp

学生の就活を、その費用を含めてサポートしてくれる就活サービスです！

登録してプロフィールをしっかり書き込んでおくと、企業からイベントや説明会の案内が届くみたい。

今回のイベント

私が今回参加したイベントは、

「IT企業のエンジニア・人事担当者と1on1で面談ができる」

というもの。

参加企業

全部有名な企業ですね。（すごい。。）

もちろん、支援金も貰えます

支援金の金額は、居住地の地域で異なります。

私は関東に住んでいるので支援金は一番少ない額でしたが、それでも交通費と考えるととても大きな額でした。（支援金から交通費引いてもめっちゃ余るぐらい）

参加までの流れ

今回のイベントはTwitterの広告で見つけ、

「１日で色んな有名な企業とお話できて金貰えるってまじ！？」

って感じで速攻サポーターズに登録しました笑

ただ今回のイベントは人数制限があり、応募した全ての学生が参加できる訳でないため、電話での審査がありました。

審査は、登録したプロフィールを元に質問されてそれに答えるというもの。

審査と言っても、ガチガチに緊張するような雰囲気は無く、結構フランクでした。

そして無事に審査に合格し（私の場合は、審査の電話の最後で「参加しましょ！」と言われた）、イベント参加が決定しました。

参加までの準備

準備といってもただ２つ、アンケートと学生側が面談の冒頭で行う５分間の「自己プレゼン」スライド。

アンケートは文書を書くタイプで、何故かこのアンケートを回答すると支援金が増えます笑

お金欲しいので、もちろん回答。

スライド作成へ。

自分的にこの自己プレゼンのスライド作りがめっちゃ難しかった！

今まで自分がどんな人間なのか特に考えてこなかったので、とても苦労しました。特にこれからやりたいことやキャリアパスなどの未来のことを言語化するのに時間がかかった。

スライドには以下のような内容を書きました。

自己紹介（名前、所属、趣味など）
今までやったこと（バイト、インターン）
今やってること（研究、バイト）
作ったもの（制作物）
これからやりたいこと（キャリアパス）← めっちゃ時間かかった

なんとかスライドを完成させて当日へ

当日

f:id:ramenjuniti:20190319010849j:plain

イベントはお昼から開始だったので、朝弱い私にとってとてもありがたかった。

流れは

イベントのガイダンス
学生の簡単な自己紹介
企業紹介のLT
面談（一つの面談が25分、それを全6社と行う）
懇親会

という感じでした。

感想

とても疲れました笑

逆求人イベントは今回が初だったので、とても緊張しました笑

元々少ないコミュ力をゴリゴリ削った感じです笑

しかしそのぶん、たくさんの企業の方とお話ができ、社内の雰囲気、開発の流れ、インターンの案内など色々な情報を得ることができました！

ちなみに、このイベントでは、面談後に企業さんから自分のどこがよかったのかフィードバックコメントを頂けるようになっており、このコメントで他人から見た自分の良さを確認することができました！

さらに、いくつか企業さんから会社見学のお誘いなどのご連絡も頂きました！やったー！

今回のイベントでの一番の収穫は、企業さんと面談している中で、自分が今後どうなっていきたいのかというのが明確化されたことでした。

今後の企業やインターンの選び方にしっかりと軸を持つことができるようになった気がします。

このイベントに参加できてとても良かったです！

2018-12-23

Gatsby.jsでAnt DesignのThemeをいじる時にうまくいかなかった話

JavaScript React

どうも。

最近、自分のポートフォリオサイトを作るためにGatsby.js+Typescript+Sassでちょこちょこやっているのですが、その時発生した問題とその解決方法を書いてこうと思います。

Gatsbyのstarterは

github.com

を使用しました

問題

UIはAnt Designでやってこーってことで

これを入れて

github.com

Themeをいじりたかったので

こちらの記事を

qiita.com

参考にしながらgatsby-config.jsを編集し、試しにボタンを出してみると

<Button type="primary">Primary</Button>

f:id:ramenjuniti:20181223213528p:plain

全然antdじゃないやつ出てきた！

っていう問題

解決方法

stackoverflowにあった😅

stackoverflow.com

なのでこれを参考に

yarn add babel-plugin-import less less-loader gatsby-plugin-less

で必要なものを入れ、gatsby-config.jsのgatsby-plugin-lessの部分を以下のように編集

module.exports = {
  siteMetadata: {
    name: `Hello Typescript World!`,
    tagline: `Gatsby + SASS + Typescript = 💪`
  },
  plugins: [
    `gatsby-plugin-sass`,
    `gatsby-plugin-typescript`,
    `gatsby-plugin-tslint`,
    {
      resolve: "gatsby-plugin-less",
      options: {
        javascriptEnabled: true,
        modifyVars: {
          "primary-color": "#FAAD13",
          "layout-body-background": "#BEC8C8"
        }
      }
    }
  ]
};

さらにgatsby-node.jsを作成し、以下のように編集

exports.onCreateBabelConfig = ({ actions }) => {
  actions.setBabelPlugin({
    name: "babel-plugin-import",
    options: {
      libraryName: "antd",
      style: true
    }
  });
};

package.jsonは以下のような状態です

{
  "name": "gatsby-starter-typescript-sass",
  "description": "Gatsby typescript sass starter",
  "license": "MIT",
  "version": "1.1.1",
  "scripts": {
    "develop": "gatsby develop",
    "build": "gatsby build",
    "serve": "gatsby serve"
  },
  "dependencies": {
    "@babel/core": "^7.1.2",
    "antd": "^3.11.2",
    "gatsby": "^2.0.40",
    "gatsby-plugin-antd": "^2.0.2",
    "gatsby-plugin-less": "^2.0.8",
    "gatsby-plugin-sass": "^2.0.3",
    "gatsby-plugin-typescript": "^2.0.1",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "node-sass": "^4.10.0",
    "react": "^16.6.0",
    "react-dom": "^16.6.0",
    "typescript": "^3.1.6",
    "webpack": "^4.25.1"
  },
  "devDependencies": {
    "gatsby-plugin-tslint": "^0.0.1",
    "tslint": "^5.11.0",
    "tslint-loader": "^3.5.4",
    "tslint-react": "^3.6.0"
  }
}

そしてgatsby developするとボタンは

f:id:ramenjuniti:20181223220808p:plain

ちゃんとantdになり、themeも変更できました🎉

2018-11-02

GAE/Go1.11でのapp.yamlの話

Go GAE

どうも、GAE初心者で何も分からんマンです。

今回は、Google App EngineでGo1.11を使う時にエラー吐かれたけど、調べたら解決できたから備忘録として残しておくよってやつ。

早速本題へ

deployでエラー吐かれた。

ERROR: (gcloud.app.deploy) skip_files cannot be used with the [go111] runtime. Ignore patterns are instead expressed in a .gcloudignore file. For information on the format and syntax of .gcloudignore files, see https://cloud.google.com/sdk/gcloud/reference/topic/gcloudignore.

app.yamlはこんな感じ。

runtime: go111

handlers:
- url: /.*
  script: _go_app

skip_files: 
- .*vender

go111はskip_filesダメよみたいな？

調べると

gcloud topic gcloudignore | Cloud SDK | Google Cloud

.gcloudignoreを作れってことらしい（多分）

とりあえず簡単に作る .gcloudignore

#!include:.gitignore

そしてapp.yamlを更新

runtime: go111

handlers:
- url: /.*
  script: _go_app

そしてdeployすると

ERROR: (gcloud.app.deploy) INVALID_ARGUMENT: script field for handler '/.*' must be set to 'auto' for runtime go111.

って怒られた

これも調べてみると公式がちゃんと記事出してた、やったぜ（beta版ですが）

Building a Go App on App Engine | App Engine standard environment for Go 1.11 docs | Google Cloud

でそこからさらにapp.yamlを更新

runtime: go111

これでdeployしたらうまくいった😁

ramenjunitiメモ

自分なりに調べたものをまとめたり、文章を書く練習したり

GoでChrome拡張を作った話

2019/07/08更新

作ったもの

Demo

機能

コードはこちらから

ダウンロードしたい方はこちらから

Go + WebAssemblyとは

構造

注意

つらみ

まとめ

MojavaでCaboChaをPythonバインディングしようとしたらエラーが出た

何がおきたか

解決方法

選択した文字をそのままThe Go playgroundで実行してくれるchromeの拡張機能を作った

作ったもの

作った理由

審査

技術書展6に行ってきました

開場前

開場後

買ったもの

サポーターズ1on1面談イベントに参加した

サポーターズとは

今回のイベント

参加企業

参加までの流れ

参加までの準備

当日

感想

Gatsby.jsでAnt DesignのThemeをいじる時にうまくいかなかった話

問題

解決方法

GAE/Go1.11でのapp.yamlの話