こんにちは。 ポイントメディア事業本部エンジニアの、あっきー（@akkiihs）です。 2019/01/30(水)に開催した『VOYAGE GROUP エンジニアの公開ガチ評価会』の評価資料・評価結果を公開します！ （大変おまたせしました、、！） voyagegroup.connpass.com イベント経緯 その前に、イベントを開催するにあたった経緯など簡単に書いておきます。 もともと、このイベントを開催した経緯として、PHPカンファレンス2018がありました。 VOYAGE GROUPは、PHPカンファレンス2018のスポンサーであり、セッションやブースにてエンジニア評価制度である『技術力評価会』について話をしました。 ただ、話をしただけでは、概念としては伝えられても「実際のところ、どんな感じなの？」ってところが、まだ伝わりきりません。 そこで、実際の技術力評価会をイベント形式で見ても

インフラのボトルネックを理解する コードはもちろん、リリースしてから安定して動かせるように面倒を見るまでが仕事というのが、弊社の開発スタイルなので、そこで最近学んだことについて、文献や自分の実体験からボトルネックに関する考え方をまとめてみた。 CPUボトルネック CPU使用率に対する基本的な考え CPU使用率が80％から90%をずっと推移している！と聞くと、自分のPCの感覚だと、「やばそう」という感覚に陥りますが、インフラにおいての使用率はそうとも限りません。 CPU使用率高い: うまくリソースを使い切っている CPU使用率低い: オーバースペック ただ、高いCPU使用率にも許容出来る度合いがあったりもするので、そこらへんの判断軸などを踏まえて、まとめてみる。 現実世界の例 CPU使用率が高い状態というのは、実世界に置き換えると、店員がみな忙しく働いているという状態です。利用者からすればオ

一昨日の4/25開催された Laravel/Vue.js 勉強会に参加してきた。 laravue.connpass.com Laravel/Vue.js 勉強会は第1回に登壇枠で参加させていただいたこともある。 blog.okashoi.net 以下、参加しながら取ったメモ。 [登壇枠1] Laravel と Nuxt.js を業務で取り入れる際に得た知見 LaravelとNuxt.jsを業務で取り入れる際に得た知見 from ssuserb6dacf www.slideshare.net 株式会社 IT プロパートナーズ 戎島さん @isao_x ／森山さん @frostndays プロジェクト概要 toC の 大規模 SNS のようなもの Nuxt.js → SSRモード／SPAモードが選べる ogpタグの懸念から SSR モード 認証方法 APIでやる Laravel Passpor

Reactとは 勉強会の講師 twitter.com React とは Componentを作るだけ データの流れは単方向 仮想DOMを扱う Component 再利用可能なパーツ Componentを作って組み合わせる JSXを使って行く JSX JSの構文中にXMLをかける propsとstate props Component生成時に親から渡されるオブジェクト イミュータブル 外部とのインタフェース state 動的に値を変化させられる Component内で管理 Componentのライフサイクル https://qiita.com/kawachi/items/092bfc281f88e3a6e456 Redux ReduxをつかうことでReactのComponentでは Stateを管理せずにpropsだけを使うようにできる yarn パッケージ管理ツール package.jso

ポエムを書く. このブログは技術ブログにしようと思っていたけど, 力が入りすぎて肩が凝るのと, 気が重くなって書く気になれないので考えてること書くためにも使おう. 120%の力を出す 人のツイートを見てふと気づいたことを書く. 革新的で、人々を幸せにして、世の中を前進させるようなプロダクトって簡単には作れないし、天才でなければ1人で作ることもできない。 だから、それぞれが120%のパフォーマンスを出して、組織として200%のパワーを発揮するような環境を作りたい。— 桑原翔大 (@_skuwa) 2018年4月14日 よく120%の力を出すっていうけども, これってどういう意味なんだろう, と考える. 120%と聞くと 体壊すくらい頑張って他のこと捨てて必死こいてやる みたいなイメージを受ける. ちょっとブラックな思想. 実は そんなにハードルが高い, 高尚なことじゃなくて 今できないことを

TL;DR 命名はプログラミングの中で重要かつ難しいタスクである コメントが出てきた時点で一考しよう. リファクタリングのチャンス 抽象化は慎重に 仕事を小さくすることで命名は比較的簡単にできる コードに残らない事情はコメントで表明する あるslackの雑談から始まった 僕が属しているコミュニティであった雑談から. ういろう [11:26 AM] 結構、コメント書くって難しいよね・・・ コメントと変数名は、プログラム書くより難しいんじゃないかって思ってる。 抽象メソッドにどんなコメントを書くかーみたいなことも今考え中。 okashoi [11:41 AM] 抽象メソッドなら入出力だけわかればいいんじゃないのかな > コメントと変数名は、プログラム書くより難しいんじゃないかって思ってる。 わかる。プログラミングするときに最も脳のリソースを消費するのは命名かなっておもってる（やや大げさ） うい

この記事にて blog.okashoi.net Google Analytics や Search Console の設定を変えないといけない気がするので、そのあたりでやったことをまとめようと思う。 と書いたので、まとめた。 Search Console 新しくウェブサイトを登録する Search Console トップの「プロパティを追加」から「ウェブサイト」を追加。 ※2018/03/27 現在、新しい Search Console の画面からのプロパティ追加はできない 所有権の確認は 「別の方法」 > 「ドメイン名プロバイダ」 から「ドメインレジストラまたはプロバイダ」を選択し、指示通りにDNSの設定を行う。 ※ 「別の方法」 > 「HTMLタグ」 では、後述のアドレス変更ツール利用の際に新旧サイト同時確認ができないので注意 アドレス変更ツール 変更前のウェブサイト（~.hatena

ぞえ(zoe302)氏が設定した、というのを受けて私も続いて。 blog.zoe.tools やったことは記事そのままなので、ここでは手順の解説はしない。 とりあえず報告まで。 このあと Google Analytics や Search Console の設定を変えないといけない気がするので、そのあたりでやったことをまとめようと思う。 あと、最近更新が滞っていたのと3月も終わるので年度ふりかえりコンテンツでも。

動機 仕事で, React + Redux + TypeScirpt + WebPackを使うことになりそうなので学んでいく. そもそもjsに疎いので探り探りやっていく. 間違えもあるかもしれないが, 徐々にやっていこう. TL;DR Fluxとは, アプリケーションのデータフロー管理のためのアーキテクチャパターン イベント駆動であり, 一方向のデータフロー制御を行う Fluxの特徴は, Viewで独立したデータを持つ, データ状態を一方向のフローで制御, Event駆動である. FluxはAction, Dispatcher, Store, Viewの4要素で構成される. Reduxとは Reduxとは, Facebookが提唱, 開発しているJsApp. jsにおいて, データの状態(データの流れ)を管理するためのツールである. ReduxはFluxの実装と聞いたことがあるので, Re

ブログを定期的に書くようになってきたので、モチベーションをあげる意図を含めて、独自ドメインをブログに設定しようと思う。 はてなブログをプロにする はてなブログは独自ドメインはプロ版にしないと設定できないのでプロ版にアップグレードする。 プロへのアップグレードは下記から申請できる。 hatenablog.com 30日間は無料なので迷ってる方は一旦あげてみるのもいいかもしれない。 DNSにCNAMEを登録 はてなブログの独自ドメインのヘルプに沿って自分の所有するDNSにCNAMEを登録する。自分の場合はCONOHAのDNSで運用しているので下記のように登録した。 はてなブログにドメインを設定 自分の独自ドメイン化したいブログの「設定」→「詳細設定」→「独自ドメイン」から自分の使いたいドメインを入力する。 以上で手順は終了。 ちゃんと設定すると下記のようになる。 ちなみに、、 間違えて先にはて

読んだものメモ 背景とかはこちら zoe3.hateblo.jp 2018/03/07 サービス開発をしてみた話。自分もプライベートでサービス開発してる身としては、リリースしてからも地道な努力が必要というのがとても共感できました。 qiita.com 型ありと型なしのお話。後半難しくて読むのに少し時間がかかった。。 qiita.com ペアプロを通して、実感したプログラマの悪習慣をまとめてあるものです。 身に覚えがあるものがあれば解決策もあるので直していくといいですね。 qiita.com チームにdockerを布教するのにdockerの魅力が伝わる記事を共有しました。やっぱりdocker便利ですよね。 qiita.com 自分がPMすることになったので、勉強に読んでました。炎上させないようにがんばらなきゃ。 paiza.hatenablog.com ghqが便利らしいという噂をきいてたの

読んだものメモ 背景とかはこちら zoe3.hateblo.jp 2018/03/05 OAuthってたまに聞かれて説明めんどくさいので。。 qiita.com 浮動小数の精度落ちの話 PHP: 浮動小数点数 - Manual バグって気軽に言われるとつらいよねって話。とてもわかる。 workerexperience.hatenablog.com カラムの命名規則や設計大切だよね。 qiita.com いいプロダクトを作るためのコツ スピードを捨てる： 成長期の個人開発アプリを頓挫させないための戦略 – 週休７日で働きたい go vet ってコマンドあるの知ってました？自分は知らなかったです！便利なので使っていこう！ tsujitaku50.hatenablog.com go と unix 哲学とそれからわたし www.google.co.jp

実務でキューイングが向いてそうな処理があったので、AWS SQS を導入したいと考えている。 導入前に調べたことを雑にまとめていく。 実際にサービスで使用しているわけではなく、これから使用するために調査している段階なので、間違っていることなどがあれば教えてください。 SQS ってなにさ AWS 公式の説明から引用すると「完全マネージド型メッセージキュー」というものらしいです。 完全マネージド、というのは「完全運用保守管理代行」ということであり、ざっくり言ってしまえば裏で何が動いてるか、サーバがどういう状態かなどをいい感じにやってくれるということですね。 そしてメッセージキューとは異なるプログラム間で動作を連携させるための手法の一つであり、送信側はキューと呼ばれるデータ領域にデータを保持し、データを受ける側の処理完了は待たずに次の処理を続けるという方式のものです。 SQS の使い方 - 準備

自分のサイトを作ってみたい Symfony4 + Reactでゆるふわにアプリを作ってみたい. ヘッドホンが好きなのでヘッドホンをレコメンドするWebアプリを作ってみよう. 仕事でコードを書く時間とは別に自分のためにコードを書いてみたい どうせならということで新しい環境で作って見たい. PHP 7.2, Symfony4.1 + React(むずかったらVue2系)で作ろう. 導入 まずはphpを入れよう. phpbrewを入れる. $ brew install phpbrew $ phpbrew install 7.2.2 +openssl=$(brew --prefix openssl) ===> phpbrew will now build 7.2.2 ===> Loading and resolving variants... Checking distribution check

読んだものメモ 背景とかはこちら zoe3.hateblo.jp 2018/02/27 意外と知らない人が多そうだったのでぺたり。composerでのバージョン指定の書き方とか Composerのバージョン指定方法でのチルダ（~）とキャレット（^）の違い — A Day in Serenity (Reloaded) — PHP, FuelPHP, Linux or something はてなブログのトップに出てたので読んだ。自分自身悪いテックリードとならないように努めようと思う。 tannomizuki.hatenablog.com

前回の振り返り 前回は, fetchの第2引数としてrequestのパラメタを設定する方法について触れた. Responseオブジェクト Responseインスタンスは, fetch()プロミスが解決(resolve)された時に返り値として渡される. どんなレスポンスオブジェクトでも共通で使用できるレスポンスプロパティを持つ Response.status HTTPステータスコードの整数値(デフォルト200) Response.statusText HTTPステータスコードのメッセージと一致する文字列(デフォルトOK) Response.ok HTTPステータスが200~299のうちに収まっているかどうかのショートハンド. Booleanを返す Response()コンストラクタはオプションとして2つの引数をとることができる - レスポンスボディと初期化オブジェクトです(requestが受

前回のふりかえり 前回 は MDN fetchからfetch, promiseの概要について触れた. promiseを使うと, 簡潔に非同期処理を記述できる. fetch apiを使うことでわかりやすくhttp req/respの操作を行える. 今回もMDN fetch api を読んでいこう. リクエストにオプションを適用する fetch()メソッドには2つ目の引数を適用することもできます。 多数の設定をコントロールすることのできる初期化オブジェクトです。 // Example POST method implementation: postData('http://example.com/answer', {answer: 42}) .then(data => console.log(data)) // JSON from `response.json()` call .catch(e

fetch fetchを雰囲気でしか理解できていないので学んでいこう mdn fetch概説 fetchはjsのAPIであり,リクエストやレスポンスといったHTTPのパイプラインを構成する要素を操作できるようになる. またfetch() メソッドを利用することで、非同期のネットワーク通信を簡単にわかりやすく記述できるようになります。 うむ, productionコードでもfetchが登場する. XMLHttpRequestとの違いはなんだろう XMLHttpRequest XMLHttpRequest は、クライアントとサーバーの間でデータを伝送するための機能をクライアント側で提供する API です。ページ全体を再読み込みすることなく、URL からデータを読み出す簡単な方法を提供します。この API によって、ユーザの作業を中断させることなく Web ページの一部を更新することができます。

読んだものメモ 背景とかはこちら zoe3.hateblo.jp 2018/02/22 DynamoDBについての資料 日本最大の即レスサービス「アンサー」を支える Amazon DynamoDB from Masahiro Akita www.slideshare.net テスト環境のデータのマスキングを AWS Glue 使ってやる方法 qiita.com t_wadaさんのでぶさみの発表資料後で読む speakerdeck.com t_wadaさんつながりで一度は読んでおいたほうがいいと思ったので載せておく speakerdeck.com 勉強会やったブログ書いたので宣伝 tech.willgate.co.jp

たまには自分を振り返る時間があってもいい 最近仕事でもやもやすることがおおい. 頭をダンプしてみよう ここ一年, プログラマをやってみてどうだろう 何もできないと無力感を感じることが多い 自分はチームに不要なのではと思うこともしばしある. これはチームが求めるスピードや周りのエンジニアとの比較によって思う部分が大きい. とはいえ, 自分が作ったものや自分が考え出したものによって 少なからずお金が生み出されていっているのは尊い事実である. そして何よりも, 昔は自分にはできないと思っていた技術で今は飯を食っていることがなによりも進化である あと, 何も進んでいないわけでもない 自分が本格的に自分の力で技術を学び始めたのはB4の終わりだったと思う http://namu-r21.hatenablog.com/entry/2015/02/18/175958 ブログを見る限りでは3年前の今頃である