CSS Grid Layout を極める！（基礎編） - Qiita
CSSをちょっと書けば、こんなレイアウトが出来てしまいます！ 当記事では、こんなレイアウトを可能にする CSS Grid Layout の解説をしていきます。 尚、CSS Grid Layout は現時点（2017年4月）ではまだ新しいモジュールのため、対応ブラウザが少ないです。 （Fx52～、GC57～、Safari10.1～、Opera44～ など） Can I use... CSS Grid Layout しかし、2017年3月にはFirefox, Google Chrome, Opera, Safari などが CSS Grid Layout 対応のバージョンをリリースしており、今後に対応ブラウザが急増するのは確実なので、ぜひともマスターしておきたいです。 この記事は4部構成の中の 基礎編 です。 CSS Grid Layout を極める！（基礎編） ←これ CSS Grid La
OSSのライセンスを理解する（「使用」と「利用」の違い、知っていますか？） - Qiita
参考文献 オープンソースソフトウェアとは - Weblio辞書 プロプライエタリソフトウェアとは - Weblio辞書 派生プログラムとは - Weblio辞書 フリーウェア - Wikipedia ソフトの配布とライセンス - 可知豊 OSSをライセンス的に正しく使う／プロプラだけの製品とするための11のチェックポイント - NEC GitHubを利用する際に注意したいOSSライセンスのポイントとは - Think IT オープンソースとは - 日本ユニシス 著作権審議会マルチメディア小委員会ワーキング・グループ中間まとめ - 公益社団法人著作権情報センター CRIC 企業技術者のためのOSSライセンス入門（1）：訴訟が増えている!? OSSライセンス違反 - ＠IT 2.「オープンソースの定義」を理解する OSSを規定する上で重要となる「オープンソースの定義」を知っておくと、主要ライセ
<script> タグに async / defer を付けた場合のタイミング - Qiita
HTML5 においては、<script> タグに、defer や async 属性を付与することで、これらの読込が HTML パースを妨害しないようにすることができます。これにより、サイトのメインコンテンツの読込がある程度高速化されます。 async にせよ defer にせよ、それほど詳細に動作を解説した記事が見つかりませんでしたので、本記事では、これらの動作について解説します。 イベントについて まずは、async と defer の挙動を理解するために重要な、2つのイベントについて理解しましょう。 両者とも、MDN に十分な情報があるため、本記事ではそれほど詳細には解説しません。 DOMContentLoaded HTML のパースが完了した直後に発火します。 MDN load HTML のパースが完了し、CSS や画像などのダウンロードと表示、JavaScript ファイルのダウン
Visual Studio CodeでVue.jsアプリケーションの開発環境を構築する
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 Visual Studio Code（以降VSCodeと表記）でVue.jsを利用したアプリケーションの開発環境を構築したときのメモです。 Node.jsやESLint、Vue.jsはすでにnpmでインストールしているという前提です。またgit操作にGit for Windowsを使用します。 なお、Vue.jsを含めフロントエンド開発について学習中の身のため間違っている点などがあると思いますが、そのときはご指摘いただければ大変助かります。 環境 Windows 10 Professional VSCode 1.22.2 Node
AI - その革命はまだ起きていない、そして起きそうもない - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Artificial Intelligence — The Revolution Hasn’t Happened Yet - Link 先週、データサイエンス、AI業界にとって、ターニングポイント（潮の変わり目）となるほど重要なエッセイをUC Berkeleyの教授で、統計、機械学習、AIの研究者でもあるMichael Jordanという人が発表していました。もちろんあのバスケのMichael Jordanとは違います。(笑) 冗談はさておき、ここ最近のビッグデータの世界では標準になってしまったとも言えるSparkを開発したのはもともと
Nuxt.jsをDokkuを使ってEC2やGCEへ気軽にデプロイする - Qiita
APIを叩かないNuxt.jsプロジェクトならgenerateコマンドで十分なのですが、リアルタイムのデータをAPI経由で取得してそれをSSRしたい場合は、VPSを借りてnode.js環境を構築して云々作業が必要です。となるとデプロイも色々めんどくさい。そんなときに便利なのがDokkuです。 Dokkuとは DokkuとはHerokuをインスパイヤして作られたPaaSです。Herokuのデプロイgit push heroku masterと似たような感じで一度環境を構築してしまえばgit push dokku masterで自分が用意したVPSにデプロイできるようなやつです。 （Dokkuの中身はDockerと数百行のBashスクリプトのようです） Dokkuを使ってNuxt.jsをデプロイする手順 まずインスタンスを用意しましょう 今回はGCEでやってみます。GCEのVMインスタンスを作
riot.js 子tagの独立性を上げる。 - Qiita
riotは親子関係を把握することが出来るが、互いのモジュールを知らないほうが独立性が上がり、並行してモジュール開発が出来る。 自分自身にトリガーを引いて(change)、第三者モジュールが変更を検知して参加者全員に知らせる。(changed) 自分自身は参加者は知らないし、誰がchangedしたのかも知らない。ただ、変更されたデータストアが投げられる。 riot.tag('ed','<div ref="code" contenteditable="plaintext-only" oninput="{input}"></div>',function(opts){ let self=this,code=null; self.on('mount',()=>{code=self.refs.code}) self.on('changed',(d)=>{ if(code.textContent!=d.
アルゴリズムとは何か！？ ～ 文系理系問わず楽しめる精選 6 問 ～ - Qiita
今の場合は A さんが 31 歳の場合のストーリーでしたが、A さんが 20 歳～ 35 歳のうちのどの年齢であったとしても、似たようなストーリーで必ず 4 回の質問で当てることができます！(他の例も是非考えてみてください。) ちなみに、このような「真ん中で切ってどちらかに絞って行く」タイプのアルゴリズムには二分探索法という名前がついています。応用情報技術者試験でも頻出のテーマですので馴染みのある方も多いと思います。 1-2. つまり、アルゴリズムとは 上の年齢当てゲームという問題では、相手の年齢を当てる「方法・手順」を二分探索法に基づいて導きました。このようにアルゴリズムとは、 問題を解くための方法・手順 のことです。さて、アルゴリズムと聞くと「コンピュータ上で実装されたプログラム」のことを思い浮かべる方も多いと思いますが、必ずしもコンピュータと関係がある必要はなく、日常生活でも多々登場
AWS、何から勉強したらいい？に対する俺の答え - Qiita
このツイートがわりと好評だったので解説。 「AWS、何から勉強したらいい？」に対する俺が考えた回答がこれ。 pic.twitter.com/ouuP3P27Bu — 伊藤 祐策(パソコンの大先生) (@ito_yusaku) 2018年4月17日 AWS、何から勉強したらいい？ これは誰向け？ メンテナー以上の領域を目指す人向け。 オペレータ ... システムの運用、監視、障害調査＆対応をする人 メンテナー ... システムの拡張、改善をする人 アーキテクト ... システムを１から設計、構築する人 解説 各科目の選定基準 必修科目 ... AWSを本番運用するにあたって絶対に避けては通れないサービス。 重要科目 ... 間違った設計をすると、あとから取り返しがつかないサービス。 選択科目 ... 学習量を削るために仕方なく必修から外したが、Webサービスを構築するにあたりほぼ必須となるサ
ブラウザバック禁止 - Qiita
window.location.hash="#noback"; window.onhashchange=function(){ window.location.hash="#noback"; } http://hidari-lab.hatenablog.com/entry/2015/03/02/212818 に詳しいです。 URLにhash（URLの後ろにくっつく#HogeHogeみたいな文字列で、ページ内リンクなんかに使われてる）をつけることで別ページへの遷移として履歴に残して、他のページに戻れなくしてしまう方法。 ブラウザの「戻る」ボタン長押しなどで、履歴を直接たどるのは止められないけど、無意識にブラウザバックする人は止められるかなと。
JavaScriptを劇的に教えやすくするWebサーバ作りました - Qiita
近年、JavaScriptでコードを書こうとすると、お膳立て7割、コード書き3割みたいな事態がざらにあります。「お膳立て」の例としては、Gulp, Babel, Sass, PostCSS, WebPack, Rollup, Browserifyほか数限りなく。 たしかに、一旦フロントエンド開発に慣れてしまえば、お膳立てにかける時間は短縮することが可能です。でも、これを初学者に強いるのはツラすぎる...! 覚える方はともかく、 教える側がツライ。 今回、未来なJavaScriptやCSSの文法で書いても、よしなにとりなしてくれるWebサーバ「Felt」を作ったので、ご査収ください。 (2016/7/19 関連ツールとの比較を追記しました) GitHub: https://github.com/cognitom/felt npm: https://www.npmjs.com/package/
webpack 4 入門 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? お知らせ（2020/08/25 追記） Udemy で「webpack 最速入門（10,800 円 -> 2,000 円）という講座を公開しました。 本来の価格は10,800円ですが、上記リンクからアクセスすると2,400円で購入できます。 どんな内容？ webpack を利用したフロントエンド開発環境が構築できるようになる、ハンズオン形式の講座です。 詳細は上記のリンクのプレビュー動画で詳しく説明しています。 記事との内容の違い 記事の内容に、以下の内容や特徴が追加された感じです。 実務で利用できる開発環境を徐々に構築していくので、記
他人のコミットをgit merge --squashするべきでないのではという話 - Qiita
最近某OSSに出されたPRが、git merge --squash <branch> でマージされたことにより、コミットのAuthorが書き換えられてしまったことが一部界隈で話題になっていました。この件にはマージを行った人に悪意はなかったようなのですが、gitの理解不足により生じてしまった案件だとすると悲しい話なので一応メモ 何が起きたか コミッターが複数の内容が含まれたPRを送った 管理者はその中の一部の内容だけをマージするために、管理者はgit merge --squashを実施し、コミットを改変した上でmergeを実施した ←これが問題 コードの内容はコミッターのものなのに、Authorだけ管理者にすげ変わってしまいコミッターのモチベを損ねた そもそもsquashするとどうなるの ここに分かりやすくまとまっています。 アジャイルSEを目指すブログ 図で分かるgit-mergeの--f
工数見積もりのコツ - Qiita
はじめに 本稿では、仕事をする上での作業工数の見積もり方法について説明します。 工数とは何か 工数(こうすう1)というのは、仕事において、あるひとつの作業を完了するまでにかかる総累計時間のことです。情報処理技術者試験に出てくるTAT(ターンアラウンドタイム)とは意味合いが異なります2。 例えば、ある作業に40時間(40H3)かかるとした場合、工数は40時間であるといえます。1日8時間勤務だとした場合、40時間は5人日(にんにち)と表現することができます。さらに、1ヶ月20日勤務だとした場合、0.25人月(にんげつ)と表現することもできます。 一般的に工数の単位は「人日」および「人月」で扱います。 学生時代は工数を気にすることはないですが、ITエンジニアとして会社で働くようになると、かならず工数を意識する必要があります。 なぜ工数を意識する必要があるのか なぜ工数を意識する必要があるのかとい
JavaScriptのクロージャはメモリーリークをちゃんと理解して使おう - Qiita
はじめに 前にブログで書いた記事なのですが、せっかくなのでQiitaにも投稿します。 脱初級者の壁として君臨しているクロージャ。クロージャの使い方はわかったけど、いろんな記事を見るとクロージャは問題点もあるみたい。それに、そもそもクロージャの使い所がいまいちわかんないと思ってクロージャに再度立ち向かおうと思った次第です。同じような悩みを抱えているデザイナーさん、コーダーさん、フロントエンドエンジニアさんの参考になれば嬉しいです。 クロージャとは とりあえずおさらい & 補足をします。 よく見かけるクロージャの見本がこちら。 ここで簡単にクロージャについて説明します。ちなみに、最近読んだ本で何となくJavaScriptを書いていた人が一歩先に進むための本が説明としてわかりやすかったので、そちらを引用させていただきながら。 まずクロージャとは ローカル変数を参照している、関数の中に定義している
フロントエンドのコンポーネント設計に立ち向かう - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ReactやVueなどコンポーネントベースで作っていくViewのライブラリが普及したことで、コンポーネント指向での開発が一般化してきた昨今のフロントエンドですが、このコンポーネントの設計に悩まれる方も多いのではないでしょうか。 コンポーネントをどの粒度、どんな状態で分割するのが良いのか、などなど、特にチームで開発する時に認識が揃っていないとカオスになりがちな部分であると思うので、自分なりの設計をする際の指針を言語化しようというのが本記事の目的です。同じように悩まれている方にも何らか示唆を提供することができたら嬉しいです。 想定読者 「コ
中一が深層学習でAI作った話 - Qiita
本題 今回は信号機の分類をしていきたいと思います。 画像はgoogleで"赤信号","青信号","黄信号"と検索し、17枚くらい手動でダウンロードしました。なぜスクレイピングしないかというと、googleで検索したところ、写真の数が全然なくて、関係ない人がめっちゃ写っていたので、使える写真をダウンロードしていったら17枚ぐらいでした。 データの前処理をして、そっからテスト用に5枚ぐらいとっておき、後の12枚を水増ししました。 from PIL import Image import os, glob import numpy as np classes = ["red", "blue", "yellow"] num_classes = len(classes) image_size = 50 num_testdata = 5 X_train = [] X_test = [] Y_train
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
OS X に Microsoft Edge テスト環境を作る（VirtualBox）
Riot.jsでの注意 - Qiita
webpackでのTypeScriptビルドが遅い件 リンク集 - Qiita
