必要な物は紙とペンだけ！ペーパープロトタイピングのススメ
まずは紙。家にあるチラシの裏の白い部分でも可能なのですが、方眼のものが製図しやすいです。お気に入りのノートを使ってみてください。後述するプロトタイプ制作ツールのMarvelから、無料のプロトタイピング用紙（PDF）が配布されているので、こちらを使ってみてもいいですね。 基本的にどんなペンでも構わないのですが、太いペン、細いペン、薄い色（灰色）のマーカーの3種類あれば文句なしです。マーカーはなんやかんやコピックが使いやすいのかなーと思います。 その他 紙とペンだけでOKですが、よく使うアイコンが手軽に描けるUI Stencilsという定規兼ステンシルがあると便利です。iPhone用ステンシルだけではなく、様々な種類が用意されているので、興味のある方はUI StencilsのWebサイトを覗いてみてくださいね。 ペーパープロトタイプの描き方 1. ざっくりとしたレイアウト組み まずは画面をレイ
会社でPhpStorm導入したのに若者がサ○ラエディタ程度にしか使えてないっていうからモブプロしたよ｜技術ブログ｜北海道札幌市・宮城県仙台市のVR・ゲーム・システム開発 インフィニットループ
会社でPhpStorm導入したのに若者がサ○ラエディタ程度にしか使えてないっていうからモブプロしたよ makiです。毎日暑いですね。札幌も十分に暑いですよ？ 会社の自席は冷房が直撃するので、IKEAの葉っぱで防御してます。 弊社にはゲーム開発を行っている第1第・2グループの他にその他の事業開発を行う、第3グループというものがあります。表に出せるものだと、シュキーンやgrooonをなどを企画・開発しています。 先日、この第3チームのエンジニアを集めて、モブプロを行いました。 というのも弊社ではフルタイム以上のエンジニアが希望すれば、PhpStormのコマーシャルライセンスを使うことができます。 昨年から導入を始め、最新データによるとエンジニア全体の約半数がPhpStormを使っています。母数にはPHPを書かないUnityやアプリ開発系のエンジニアも入っているので、PHPを書く人だけを母数にす
今からでも遅くない！PHPerも型を書こう！ - Qiita
最初にまとめ 型を書くとオブジェクト指向をちょっと意識しやすくなるよ 本稿の目的 PHPは歴史的に型を書かない人が多いです。 そういう自分もPHP7.x系になるまで書いたことはほとんどありませんでした。 書かなくても動くしなんでそんなめんどくさい事をわざわざ、、、みたいな。 そんな自分でも今は型が書いていないと気持ち悪いと感じる位になれたので、その思考の過程をご紹介していきたいと思います。 ただ、本稿は型の素晴らしさや型安全なプログラミングとは等を正攻法で説明するというのが意図ではないです。 ちょっと普段とは違う目線で型を書くメリットを紹介してみようと思います。 型 is 何？ 型とはそもそも何でしょう？ 端的に言えばデータ型という事になりますが、今回は少し違った見方をしたいと思います。 それは 『型とはふるまいに対する主語です』 本稿はこんな視点で型について説明したいと思います。 そもそ
BUNDLED WITH で Gemfile.lock が更新されてしまう件 - Qiita
BUNDLED WITH って何？ bundler 1.10.0 以降で作成された Gemfile.lock では、BUNDLED WITH というセクションがあって、使用された bundler のバージョンがトラックされるようになっている [3485] 。 例えば bundler 1.9.0 で作成された Gemfile.lock のあるプロジェクト上で、 最新の bundler 1.10.3 を使用して bundle install --path vendor/bundle すると、 Gemfile.lock には以下の差分ができる。 これをもう一度 1.9.0 で bundle install すると、上の文字はきれいさっぱり消える。 BUNDLED WITH の何が困るか 多人数で開発するときには、この変更は微妙に邪魔で、意図しない Gemfile.lock 変更が出てしまうことで
RailsでWEB API入門 - Qiita
# require database cleaner at the top level require 'database_cleaner' # [...] # configure shoulda matchers to use rspec as the test framework and full matcher libraries for rails Shoulda::Matchers.configure do |config| config.integrate do |with| with.test_framework :rspec with.library :rails end end # [...] RSpec.configure do |config| # [...] # add `FactoryGirl` methods config.include FactoryGirl
Railsチュートリアル幻の15章 React編 - Qiita
社内で利用した、Reactの研修資料を公開します。 Railsチュートリアルの続編として作成したので、Rails上でReactを使うためには...ということが書かれています。Railsチュートリアルテイストになっていますが、一部社内でのコーディング規約や利用するライブラリについての言及があります。 また、研修ということで、ソースコードはGitHubの差分をスクショするという形で掲載しています。コピペできるコードが欲しいという人は、差分表示を作るのに使ったリポジトリを利用して下さい。 https://github.com/kouheiszk/sample_apps/tree/master/5_1_2/ch15 第15章 Reactの導入 この章では、サンプルアプリケーションで作ってきたUIパーツをReactというJavaScriptのライブラリを利用してコンポーネント化していきます。具体的に
Rails 5.1 + Vue.js で開発を行う - part1 環境構築 - Qiita
概要 Webpacker を利用してRails 5.1 + Vue.js で開発を行う方法を紹介。 本記事では、開発環境を整えるまで行う 次回の記事では、Vue.js を使って Ajax 通信を行います。 Rails 5.1 + Vue.js で開発を行う - part2 Ajax で GET しよう！から確認ください 全コードはこちらより確認いただけます ruby 2.4.1 Rails 5.1.1 Vue 2.3.4 webpacker のインストール はじめに webpacker を install します。 ※ Rails アプリをすでに作成済みという前提で話を進めます。 webpacker とは Webpacker makes it easy to use the JavaScript pre-processor and bundler Webpack 2.x.x+ to man
node.jsのversionを管理するためにnodebrewを利用する - Qiita
このTopicはWeb ApplicationのfrontendのProjectを管理するTopicの1つ目です。 node.jsのversionを管理するためにnodebrewを利用する npmでnode.jsのpackageを管理する grunt.jsを使って、frontendのビルドを行う nodebrewとは？ nodebrewは、node.jsを自分のマシン内でversion管理するためのtoolです。 最近は、Front側の開発環境として、node.jsを使うのが普通になってきました。 npm使うだけでも、node.js必要なのでWebの開発者のマシンにはほぼnode.jsが入っている感じです。 ただ、Projectごとにnode.jsのversionが違ったりすると、いちいち入れなおすのは面倒です。 そこを解決してくれるのが、nodebrewです！ nodebrewインストー
オブジェクト指向と10年戦ってわかったこと - Qiita
この記事の内容 オブジェクト指向は難しい！わかった気になって実践すると詰みます... ｳｷﾞｬｰ この記事は10年以上オブジェクト指向と戦った筆者が、通常とは異なるアプローチでオブジェクト指向を解説したものです。 筆者はJavaを使って本格的なシステム開発をしたことがありませんが、オブジェクト指向言語として最もポピュラーなJavaをベースにオブジェクト指向について解説させていただきました。 また、この記事の続編にあたります「なぜオブジェクト指向は難しいのか」を更に2年の時を経て執筆させて頂きました！是非こちらも一読していただけると嬉しいです。 オブジェクト指向三大要素の謎 オブジェクト指向三大要素ってありますよね。オブジェクト指向は「カプセル化」「継承」「ポリモーフィズム」の3つの要素で成り立つと言われています。最近では、この三大要素が語られる傾向は薄いようですが、一度は耳にしたことがある
Dockerfileを書くときに気をつけていること10選 - Qiita
この文章では、私が個人開発で使用しているDockerサーバの管理や、業務でプロジェクトメンバーに開発環境を配布する際に、Dockerfileを書く上で気をつけていることを整理します。 1. Dockerファイルのフォルダには不要なファイルを置かない docker buildは開始時にコンテクスト(現在のフォルダの状態)をDockerデーモンに転送します。具体的には、Dockerfileのあるディレクトリの内容をtarで圧縮し送ります。そのため、Dockerfileのディレクトリに不要なファイルがあるとビルドに余計な時間がかかりよくありません。 とはいえ、プロジェクトフォルダでビルドした成果物をイメージ化するためにDockerfileを含める運用はよくあると思いますので、その場合は.dockerignoreファイルを記述して余計なファイルが転送対象にならないようにします。 .dockerig
【今日からできる】コミットメッセージに 「プレフィックス」 をつけるだけで、開発効率が上がった話 - Qiita
はじめに 今まで commit message を「なんとなく」書いていたが、プレフィックスをつけることで、コミットメッセージに対する考え方が変わった。 そのおかげで開発効率が上がったので、その内容をシェア。 プレフィックスをつけるってどういうこと？ 以下のようにコミットメッセージの先頭に、なんらかの文字をつけること。 feat: xxx という機能を追加 fix: yyy で発生するバグを修正 refactor: zzz の機能をリファクタ のように feat, fix, refactor などがプレフィックスです。 最近 OSS の Contribution Guide などでよく見かけます。 導入したプレフィックスルール Angular.js/DEVELOPERS.md Angular.js の開発者ガイドに書いてあるメッセージを参考にしました。 以前のコミットメッセージ（例 ちなみ
Vue.js Devtoolsの導入方法と機能まとめ。Vue.jsを用いた開発を効率化させよう！ - Qiita
最近、JavaScriptフレームワークであるVue.jsの勉強をしているのですが、jQueryを用いて開発を進めるときと比べるとデバックに時間がかかってしまいます。 何か良い解決策を探してみると「Vue.js Devtools」というchromeブラウザの拡張機能の存在を知りました。 早速導入してみると、 作業がとても捗った ので、導入方法や使い方を簡単にまとめたいと思います。 Vue.js Devtoolsとは Vue.js Devtoolsは、Vue.jsの開発をサポートする Chromeブラウザの拡張機能 です。これを導入するとconsoleを開かなくてもdataの中身などを確認することができるようになります。 Vue.js Devtoolsの導入方法について それではさっそくVue.js devtoolの導入方法について。まずは下記URLにアクセスして拡張機能を追加します。 Vu
WebStormでVue.jsの快適な開発環境をつくる
追記(2019-02-15) WebStorm, vue-cliのバージョンが上がり状況が変わったので加筆修正 （特にJest回り） 概要 WebStorm上でVue.jsアプリケーションの開発するにあたって、そのままだと使い勝手がイマイチなところがあったので色々設定を追加したりいじったりしたらだいぶ快適になったというお話。 なお、本記事で作成したプロジェクトはGitHubで公開しているので、参考になれば幸いである。 IsaoTakahashi/web-storm-setup 追記(2019-02-15) 最新のmasterは2019-02-15に検証した3.4.0のものになっている なぜWebStormか もともとIntelliJを使っていて、自分の手になじんでいる。 VSCodeと交互に使用感を試した結果、やっぱり自分にはJetBrains製品が一番だと思った。特に自分の中で重要視して
Laravelでwiki的なものをつくってみる(前編) - Qiita
Schooアドベントカレンダーの20日目の記事です。 はじめに わたしについて こんにちは、Schooの@ohidaです。2016年9月にSchooにジョインし、イノベーション推進室及びプロダクト戦略室という部署で、新規事業を推進したりSchooをよりイケてるサービスにするお仕事をしています。会社ではてへぺろちゃんと呼ばれています。 私は開発チーム所属のバリバリのエンジニアではないのでSchooのエンジニアリングの凄みについてはあまり語れません。ので、今回はこれから社内での導入を企んでいるお気に入りフレームワークのLaravelのことについて書きたいと思います。 なんの話をするか LaravelというPHPのフレームワークを使って簡単なウェブアプリケーションをひとつつくってみようと思います。Laravelの基本的な機能の一部+αでつくる予定です。ウェブアプリをつくるのってこんな感じで楽しい
もっともっと良いコーディングをするための勘所８つ - 病みつきエンジニアブログ
先日とあるコードレビューを拝見することがあったのですが、それにインスパイアされて記事を書いてみます。レビュワーの方が言ったことも含んでいますが、それと必ずしも一致するものでもありません。 Objective-Cのコードで書いていることが多いですが、わりと一般論だと思います。 photo by Hugo-photography 命名規則は言語の「普通」に任せる 例えば、Objective-Cだと変数にはcamelCaseを使うことが多いです。逆にRubyではsnake_caseを使ったりします。もしくは、略語を使うとか使わないとか、そういう違いもあります。 変数名に対してどういう書き方をするかというのは、個人の好みではなく、言語の慣習に任せるのがいいのではないかと思います。 言語の慣習の調べ方は、Githubで「stars:>100」と検索して、言語を絞るといいでしょう。(参考：Rubyの例
Pull Requestに動作確認方法を書け - 橋本商会
ある程度アプリケーションの規模が大きくなってくると、ある変更がどこまでの影響範囲だと思っているのかがコミュニケーションにおいて重要
最近のgitを使った開発フローについて - その手の平は尻もつかめるさ
最近のgitを使ったWebアプリケーションのプロジェクトの開発フロー (主にブランチ運用) について記すものです． なお前提としてGitHub Enterpriseを利用しています． git-flow 大上段に構えたもののあまり特殊なことはしていなくて，基本的にgit-flowをそのまま踏襲しています． git-flowについてはしっかりした解説記事がインターネット上に数多く存在しますからそれらを参考にしていただければと思いますが，ざっくり説明すると masterブランチ，developブランチ，releaseブランチ，featureブランチ及びhotfixブランチがある masterブランチは常にリリース可能な状態になっている (すなわち現在本番で稼働しているアプリケーションのコードと等しい) developブランチは開発中の状態で，ステージング環境等に上がっている releaseブラン
HTTP | MDN
HTTP ガイド リソースと URI ウェブ上のリソースの識別 データ URL MIME タイプ入門 よくある MIME タイプ www 付きと www なしの URL の選択 HTTP ガイド HTTP の基本 HTTP の概要 HTTP の進化 HTTP メッセージ 典型的な HTTP セッション HTTP/1.x のコネクション管理 プロトコルのアップグレードの仕組み HTTP セキュリティ Content Security Policy (CSP) HTTP Strict Transport Security (HSTS) X-Content-Type-Options X-Frame-Options X-XSS-Protection Mozilla web security guidelines Mozilla Observatory HTTP アクセス制御 (CORS) HTTP
GemfileとGemfile.lockの簡単なお話 - 雑草SEの備忘録
Ruby on Railsをやり始めたときだと、Gemfileって何？そんでbundle installするとつくられるGemfile.lockって何？みたいな感じですよね。 今日は、GemfileとGemfile.lockの簡単なお話です。 gemっていうのは、Javaでいうところのライブラリみたいなものです。結構頻繁に使われるあるまとまった処理があって、それを毎回開発するたびに書いているのは大変なのでgemという形にしてみんなが使えるようにして配布しているわけですね。 開発者は、この機能を作りたい！そのためには、このgemが必要だ！って思った時は、Rails.rootにあるGemfileに追加します。 だけど、gemの中にはさらに別のgemを使っているgemもあったりして、さらにそのgemも別のgemを使っていて…とかが往々にしてあります。 さらに、Aというgemを使うためにはZという
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
npmのコマンドでローカルサーバーを簡単に立ち上げる - Qiita
