Vue CLI v3 を利用して、あらゆるサイトに埋め込める Web Component ベースの Qiita スライドビューアーを開発した話JavaScriptVue.jsWebComponentsdeprecated Vue.js Advent Calendar 2018 の管理担当、言い出しっぺだから全部参加をポリシーで進めている potato4d です。 今年は以下の2つを公開しており、ことしは守りのコードを中心に紹介しました。 Vuexによる状態管理を含む最高に快適な Vue.js + TypeScript の開発環境を目指す話 JavaScript ベースの Vue.js プロジェクトのデータ構造を JSON Schema を使って守る ですが、ここは #1 アドベントカレンダー。せっかくなので、もう少し夢のある話をしたいと思います。 Kamishibai Viewer という

これは FOLIO アドベントカレンダー2018 の23日目の記事です。 さて、昨日の@minodiskの記事でも触れられている通り、FOLIOのWebフロントエンドではStorybookを中心に据えた画像回帰テストを実践しています。 この記事では、FOLIOに画像回帰テストを導入するためにやってきた取り組みについて書いていきます。 大まかなワークフロー画像回帰テストのワークフローを簡単に説明します。 まずは対象となるコンポーネントについてStorybookでStoryを用意します。 StorybookこのStoryからCIで生成されるキャプチャ画像がスナップショットファイルとなります。 さて、仕様変更などによって上記のコンポーネントに変更が生じたとします。

これは DevLOVE Advent Calendar 2018 - 22日目 の記事です。しがないエンジニアの１年のふりかえりポエムです。 ちょっとした行動で出会いが広がる体験をした１年でした。 スクラムマスター研修からAgile Japan発表へ2018年は認定スクラムマスター研修（CSM研修）の受講からスタートしました。CSM研修では常に考えつづけ、受講者と議論し続けた３日間で、乗り越えた受講者の間で仲間意識ができていました。１週間後、いっしょに受講した方のお誘いでCSM研修のふりかえり会に参加し、他の講師のCSM研修を受けた方とも知り合えました。 CSM研修のふりかえり会を企画した方は、Agile Japan 2018 の実行委員でした。私が所属する会社ではスクラムを実践しており、社内でもプロダクト開発の考え方や手法についてよく議論していたので、何か伝えられると思い発表することにし

皆様お久しぶりです． 「私が休学を決めるまで」を書いてから２年ほど経ちました． t-ritama.hatenablog.com この記事は5600RT，5700favという凄まじいバズり方をして大変多くの応援と支援をいただきました，それをもとに，なんとか休学せずに大学院進学の見込みが出来たため，今年の夏に大学院受験をし，無事合格しました． 本当にありがとうございます．あの記事を書いてからこのような形になるとは思ってもみませんでした． もし，私が10年前の大学生であったらこのように支援をいただくこともできなかったでしょうし，大学卒業すら困難であったかもしれません． 本当に色々恵まれました．うれしい限りです． 来年からの東京大学での生活のことを少しお話したいと思います． 東京で一人暮らしとなりますが，住居確保の問題はなんとかなりそうで，この点は安心しています． ただ，金銭的な支援が得られない状

こんにちは、ゆのん(id:yunon_phys)です。この記事は Akatsuki Advent Calendar 2018 の22日目の記事です。 前日は@kackytwさんのDQNの学習速度を改善するでした。 Engineering Managerのjob descriptionを共有する流れ 近年、Engineering Manager(EM)業界が賑わってきています。特に2018年は非常に活発化した年でした。書籍としては、エンジニアリング組織論への招待とエンジニアのためのマネジメントキャリアパスという名著が生まれました。また、Engineering Manager Meetupが3回開催され、Slack workspaceでは12/22時点で268人となっています。EMのためのPodcast EM.FMも誕生し、総再生回数が10,000回を突破するなど、多くの方から注目を集めていま

この記事についてこの記事はVue.js #2 Advent Calendar 2018 - Qiitaの 20 日目の記事です。 この記事では Google が提供しているマテリアルデザインの CSS フレームワークであるMaterial Componentsを Vue.js のコンポーネントにしていく話を書いています。 その過程で Vue.js におけるコンポーネントを作るときの要点なども一緒に書いてます。 バージョンなど Vue.js: 2.5.21 Vue CLI: 3.2.1 Material Components: 0.42.x サンプルリポジトリhttps://github.com/mya-ake/vuepress-plugin-component-catalog/tree/master/example/material-components-web アウトライン Materi

自分のエンジニア人生のほとんどがクライアント(アプリ)です。 少しだけサーバーサイドを書いていた時期もありますし、個人でRuby on Railsをやっていた時期もありますが、やっぱりアプリを作っている時が一番楽しいです。 そもそも自分がエンジニアになった理由もスマホアプリが作りたいからという理由でした。 でも正直いってアプリだけの力では何もサービスを生み出せないと思っています。 アプリもクラウドとデータをやりとりができることで価値が生まれるもちろんクラウドとデータ通信をしなくてもアプリは作れますが、なにかつまらないアプリができてしまうと感じています。 でも自分のようなクライアントばっかりやってる人間にとってサーバーサイドのコードも書くのはなかなかハード。 そこでFirebaseでこの辺りが解決できます。 FirebaseのNoSQLのデータベースCloud Firestoreが自分の中で

この記事は DeNA Advent Calendar 2018 の15日目の記事です。遅刻! こんにちは、 @karupanerura です。今日はDeNAが問題提供したISUCON8予選に関する話です。 ISUCONとは ISUCON はIiknajini Speed Up CONtestのことで、Webアプリケーションのチューニング技術を競うコンテストです。 競技開始時刻にそれまで秘密にされていたあるアプリケーションがチームごとにサーバーごとまるっと渡されて、それを制限時間内にどこまでチューニングできるかを競います。 サーバーでは参照実装としてある仕様を満たしたアプリケーションが動いていて、その外部仕様を崩さずに（外見上）同様の挙動をするアプリケーションをそれぞれのチームがチューニングしていきます。 そして、ベンチマーカーをチームごとに実行すると仕様や整合性のチェックとパフォーマンス計

Losing your job to robots is no longer a sci-fi fantasy. Here are eight skills that can keep your job from being handed off to a robot. Losing your job to robots is no longer a sci-fi fantasy. Some estimates say, robots may take over more than five million jobs across 15 developed countries. Machines could account for more than half the workforce in places like Cambodia and Indonesia, particularly

フロントエンドエンジニアの領域が広すぎる。そんな話が先日のアクセシビリティの情報交換会ででてきた。今回はそこをもう少し考えてみた。 フロントエンドの領域いつ頃からだったかフロントエンドエンジニア（以下FEE）という言葉が生まれ、IT/Web界隈でみんなの共通認識ができた。マークアップエンジニアやWebデザイナーと名乗っていた人も一部そう名乗るようになった。その当時、FEEの領域といえばHTMLとCSSでのコーディングをベースにJavaScriptでAjaxやDOM操作をしたり、もしくはFlashを再現するようなリッチなインタラクションの実装をすることだった（まだFlashも現役だったっけ）。 それがいつの間にかSASSをきっかけに開発環境の変化が起こり、Web APIは豊かになり、ViewとModelのアーキテクチャがフロントエンドでも再現されフレームワーク化し、SPAのようなものが実現可

Qwintryチームは最近、既存のすべてのプロジェクトのフロントエンドをVue.jsに移行しはじめました。新しいプロジェクトでもVue.jsを使います。 レガシーなDrupalのシステム（qwintry.com） ゼロから新しく書きなおすqwintry.comのブランチ Yii2で動くb2bシステム（logistics.qwintry.com） その他、比較的小さめのプロジェクト（ほとんどは、PHPとNode.jsでバックエンドを構築しているもの） プロジェクトの規模についていうと、 Qwintry は世界中で約50万人の顧客が使っています。アメリカとドイツに倉庫を持っていて、アメリカ国内 最大の郵送先 のひとつで、東欧や中東への出荷に注力しています。Qwintryは、アメリカのオンラインストアでグッズを購入する人たちのためのツールです。私たちの倉庫に届いた荷物をコントロールパネルで管理で

こんにちは、谷口です。 エンジニアのみなさん、デザイン周りで困った経験はないですか？ Web開発をしていると、 マージンやカラーやフォントサイズなどをちょっと変えただけでおかしくなってしまった… うまく入らなくて1px変更しただけなのにデザイナーに怒られてしまった… 作ったサービスや機能が微妙に使いづらい感じだけどどう改善したらよいのかわからない… といったデザインに関するトラブルは珍しくありません。 基本的なデザインの仕組みやルールを理解しておくと、このようなトラブルを減らして、スムーズに開発することができます。 デザインとシステムは、切っても切り離せないものです。「デザインってセンスがいるんでしょ」と思われるかもしれませんが、デザインはあくまで理論に基づいたものなので、センスなど関係なく理論を学べば習得することが可能です。 今回は、エンジニアがデザインを学ぶメリットについて解説します。

最近、エンジニアもっとファイナンスと経営に興味持つ人増えるとおもしろいんじゃないかと思ってnote書き始めました、@saboyutaka です。 ぼくが自分が講師をしているCODEBASE プログラミング講座 で一年お世話になった方、生徒の方たちと忘年会してきました。そこでLT(Lightnign Talk)をする機会があったので、最近自分が意識している資本主義のエンジニアとしての立ち回り方を話してきました。これからエンジニアになりたいという人向けに話したのですが現役エンジニアにも役に立つ情報かなと思います。 SlideSharePlaying The Capitalism Game as Software Engineer エンジニアは商品を作る技能を提供している 最近ひたすらサウザーラジオを聞いて1ヶ月ぐらい毎日聞いてるんですけど、サウザーラジオの中で、人のビジネスに時間を費やしている

Photo by Brennan こんにちは。谷口です。 転職に興味のあるITエンジニアのみなさん、転職活動はうまくいっていますか？ 私自身も何度か転職を経験していますが、最近はさらにpaizaを通して転職したいエンジニアの方々からたくさん相談を受けています。そのなかで、「転職活動がうまくいかないITエンジニア」にはいくつか共通した特徴があることがわかってきました。 「なかなか内定を獲得できない…」「思うように転職活動が進まない…」とう方は、知らず知らずに下記のような言動をとっているかもしれませんので、参考になればと思います。 転職できないエンジニアの特徴 転職活動方法は調べるけど、失敗を恐れすぎて実行に移さない 実際に転職活動をしなければ転職できないのは当然ですよね。こういう方は、失敗しないベストな転職活動の進め方が見つかるまで何もしないつもりかもしれませんが、残念ながらそんなものは存在

※ひとりでIoTまるっとチュートリアル Advent Calendar 2018 11日目の記事です。まだ登録していない方はこの機会によろしくおねがいします！ Day1で話したとおり、IoTが流行している大きな要因の一つが「通信技術」の発達です。しかし、このあたり、非常に奥が深く、また非常にややこしい。 あちらを立てればこちらが立たず、、、 基本的にマニアック(だと思われる)領域で、あまりガッツリとまとまっているものもない。そこで、今回は通信方式に関して、最近の例を交えながらまとめていきたいと思います！ 【目次】 ・プロトコルスタック ・NW : ネットワークの比較 ・NW : 超省電力・短距離通信 ・NW : LPWAN(Low Power Wide Area Network) ・APP : 通信プロトコルの比較 ・次世代通信技術5Gの可能性 TCP/IP 4階層モデルとプロトコルスタッ

Vue.jsコミッターkazuponに聞く、良質なDX（開発体験）がもたらす良質な開発サイクル 近年大きな注目を集めるフレームワークとなったVue.js。その発展の裏には、開発コミュニティをストレスなく駆動させる、コミッターたちのさまざまな工夫がありました。黎明期からVue.jsを支える、コミッターの川口和也（kazupon）さんに、フレームワークを躍進させるために必要なことを聞きました。 WebアプリケーションのUI実装を簡単に行える、オープンソースのJavaScriptフレームワーク・Vue.js。利便性の高さと導入の容易さから、近年サービスに採用されるケースが増えています。 そして、Vue.jsの黎明期から、コミッターとしてフレームワークの成長を支えてきたエンジニアがいます。Vue.js日本ユーザーグループの運営に携わるkazuponこと川口和也（かわぐち・かずや／ @kazu_po

はてなのチーム横断のエンジニアメンター制度 - Hatena Developer Blog で紹介していますが、はてなにはチーム横断のエンジニアメンター制度があります。僕も最近までメンターとして5~6人ほどのメンティーを持っていました(今は事情があってメンターをやっていないのですが)。 メンターとして1on1をする時には1on1ミーティングに備えるアンケート - しるろぐを参考にし、事前にメンティーに面談シートを書いてきてもらうという工夫をしていました。その面談シートは改善を少しずつ加えながら運用していたのですが、一度知見共有も兼ねて最近使っていた面談シートテンプレートを公開してみようと思います。 面談シートテンプレート 以下のようなフォーマットで書いてもらっています。1on1の前にメンティーに1on1用Google Docsに追記していってもらっています。1on1用Google Docs

2024-04-29 CSSってどんな勉強をしたらいいの？おすすめの勉強法3選！ 文字やタブなどWebサイトのデザインを作成するマークアップ言語がCSSです。 CSSを勉強すると、おしゃれなWebサイトやかっこいいWebサイトが作れるようになります。 また、Webサイトを作るときに必要なHTMLを理解するのにも役立ちます。 CSSを勉強するならできるだけ効率よく勉強できるようになりたいですよね。 ではCSSの勉強法はどのようなものがあるのでしょうか。 CSSの勉強法は、スクール […] 2024-04-29 WEBエンジニアから見たXserverの使い勝手と評判 レンタルサーバーのおすすめサイトを見ると、大体どこでも上がってくる有料のレンタルサーバーの一つに「Xserver」があります。 このXserverとは、どのようなサーバーで、サービスにはどのようなものがあるのか。 ホームページ関連

クックパッド社員10年目の私が、マネージャー4年間→サービス開発エンジニアに戻って分かった、たったひとつのこと はじめましてクックパッドマートの開発チームでサーバーサイドエンジニア兼テックリードを担当している勝間です。クックパッドマートは2018年1月から立ち上げに携わったメンバーの1人です。はじめましての人に、簡単に自己紹介させていただきます。 勝間　亮 (@ryo_katsuma) 1981年生まれ。大学院卒業後に技術ベンチャーに新卒入社。2009年にクックパッド株式会社に転職。サーバーサイドを中心としたサービス開発エンジニアとしてcookpad.comの開発を担当。2014年にレシピ投稿領域の責任者を経て、2017年にレシピサービス全体のサービス開発の責任者に。2018年からは新規事業であるクックパッドマートの立ち上げに携わり、現在はテックリードとして商品の配送領域の開発とエンジニア