VSCodeのオススメ拡張機能 24選 (とTipsを少し)
1. vscode-icons アイコンがついて見やすくなる。 2. GitLens とにかく強い。 「コミット単位でのファイル比較」や「最新のコミット内容とそのコミッター表示」など色々してくれる。 git blameする手間なくなる。 3. Prettier コードのフォーマットは自動でやりましょう！ 複数人のこだわりをうんたらするよりも、Prettierに委ねるのが楽。 関連のTipsはここ 4. Git History Git logが見やすい 5. Bracket Pair Colorizer カッコの対応を色付きで表示してくれる。 ものすごく読みやすくなって最高&最高！！ なおBeta版ですが、後継となるBracket Pair Colorizer 2も出ています。 6. Settings Sync どこでも同じ設定で使いたい人には便利。 ⇧ + ⌥ + U/D で設定をアップロ
JavaScriptのオブジェクト指向は、逆の順番で学んだほうが理解しやすいと思うので…
※この投稿は 2011/03/10 に こちら に投稿した記事の転載です。 これを書いた経緯 事の発端というか、きっかけは、id:perlcodesampleさんとid:gfxさんの下のポストを見て、 JavaScriptで一番簡単にオブジェクト指向プログラミングを行う方法 (id:perlcodesampleさん) JavaScriptにおけるオブジェクトの定義 (id:gfxさん) new とか prototype を使うのが推奨されてないとか、直接代入するほうが楽とかじゃなくて、挙動が違うんだよなぁ、と思ったこと。 挙動が違うんだから、もちろん使いどころも違うんですよね。 でも実際、JavaScriptのオブジェクト指向は混乱しやすいと思います。 自分もご多分にもれず、さんざん混乱させられたクチですしね。 わかってしまえば、どってことなくて、とってもシンプルなんですけどね。 せっかく
SSHなるものをよくわからずに使っている人のための手引書
SSHとは SSHとは、セキュアな通信を行うためのプロトコルです。 たとえば、HTTP。HTTPを通してブラウザからWebサイトにアクセスし、 コンテンツを閲覧したりWebアプリを利用したりします。 この「HTTP」というのもプロトコルの一種です。 HTTPもSSHもOSI参照モデルと呼ばれる層の最上位、アプリケーションレイヤーに位置しています。 なお、よく聞く「OpenSSH」とは、このSSHのプロトコルを実現するための 有名なソフトウェア（プログラム）のひとつです。 FTPのプロトコルで言うFileZillaとか、そういったイメージです。 このSSHを使うと、リモートサーバに安全にログインできたり、 ファイルをセキュアに送受信することができたりします。 SSHは「Secure Shell」の訳で、リモートシェルに特化しています。 公開鍵認証という仕組みを用いて、セキュアな通信を実現して
2018年Vue.jsとVuexを使ってる人には必ず知っていてほしいドキュメントに書かれていないコンポーネントやストア、メンテナンスの際に役立つTips - Qiita
2018年Vue.jsとVuexを使ってる人には必ず知っていてほしいドキュメントに書かれていないコンポーネントやストア、メンテナンスの際に役立つTipsTypeScriptes6DesignPatternsVue.jsVuex はじめに 私はVue.js with Vuexを使った業務で1画面30APIを叩く必要のある画面から、たったの数APIしか叩かないけれど、代わりにUIがとても機能的で複雑な画面まで設計し、構築しました。 現在は構築したシステムを保守・運用しており、その際に得られたノウハウを言語化し、共有出来たらと思います。 ※ 記事の内容に意見がありましたら直接編集リクエストをください。 ※ パフォーマンスの話はしません。 ゴール 役立つTipsを身につけコード品質を向上させる コンポーネントのバグを減らせるTips ほとんどのバグは変数から来ます。 もし全ての値が定数なら状態から
JavaScriptでClean Architectureを導入してみた - Vue.js・Reactのサンプルつき - Qiita
事の発端 始まりはこちらのツイートから。 Usecasesレイヤーを充実させていったらVuex Actionsほとんど使わなくなるな笑 — Andy (@andoshin11) 2018年6月15日 それはどういうことだよ・・・ フロントでどう使うんだ・・・？ と疑問に思い、自分なりに検証・実装してみたいと思ったのが事の発端です。 Clean Architectureとは？ まず根本の理解がほぼなかったので調べることにしました。 こことか https://qiita.com/koutalou/items/07a4f9cf51a2d13e4cdc こことか https://blog.tai2.net/the_clean_architecture.html こことか https://qiita.com/Tueno@github/items/705360b357c2a00c9532 こことか h
JavaScript おじさんが教える本当の Modern JavaScript 入門 1 - Qiita
一部修正しました Udemy で React コース公開してます。(絶対 Udemy の 1200 円割引価格にはしないので、このリンクから買ってもらうのが一番お互いに得です。) Udemy React + Redux コース 本発表における Modern JavaScript とは何か Phase 1 として以下の環境での開発ができれば Modern JavaScript に入門できたものとする。 Webpack, Parcel 等の module bundler による "module system" の活用。 ES2015+ や TypeScript といった "Compile to JS *1" の使用。それに伴う Babel によるトランスコンパイルツールの使用。 ESlint, Prettier といった集団開発における、ソース品質安定のためのツール の使用。 ここまでのツール
firebaseでサーバレスなSPAアプリを作った話 - Qiita
はじめに Firebase使ってみて便利さに感動したのでポイントまとめてみました Reactとかフロントエンドのフレームワーク使ってSPA作る分には結構戦えますね とはいえ最終的に細かい作り込みをすると辛いところは出てきそう… 作ったもの https://喫煙所.net 見たまんまですが、喫煙所の共有サービスです 喫煙者の皆様は是非使ってみてくださいｗ 使ったもの Firebase Hosting Reactでbuildした静的ページの配信 Authentication 非ログイン時は匿名認証 SNS認証使ってログイン時にグレードアップ Cloud Firestore 喫煙所情報の保存 いいね情報の保存 公開用のユーザ名の保存 Cloud Functions for Firebase Firestoreの更新をトリガーにAlgoliaのインデックス更新を実行 Algolia 主に喫煙所の検
ぼくたちのかんがえたさいきょうのi18n国家
本記事は下記のtweetから始まるスレッドに触発され、@qnighyや@na4zagin3からアイディアを拝借して書いた。 i18n力が最強の国は国内に複数の言語があり、そのうちいくつかは他国でも使われている言語の方言で、1バイト文字での代替表記が困難で、歴史的にISO-2022ベースの文字コードとUnicodeと独自エンコーディングが混在していて、フリガナなどの特殊な組版規則があり、右書き左書き縦書きを併用し、 — Masaki Hara (@qnighy) 2018年8月6日 皆さんのおかげで最強のi18n国家が建設されつつある。一瞬で滅びそう — Masaki Hara (@qnighy) 2018年8月6日 長い前置き ソフトウェアのi18nは難しい。自文化では当たり前と思っていてハードコードしてしまった仮定が崩れて、大幅な再設計を余儀なくされるからだ。気づいて再設計できればまだ良
今話題のAIをweb上で誰でも気軽に作れる「AIメーカー」を作ってみた - Qiita
今話題のAIをweb上で誰でも気軽に作れる「AIメーカー」を開発しました！ ①AIに覚えさせたいタグを入力 ②タグから自動で画像データを収集 ③AIがデータから学習 の３ステップで誰でも簡単にAIを作れます！ 動画では手相占いのAIに挑戦！ みんなもAIを作って遊んでみてね！https://t.co/66DFU7GRZ2 pic.twitter.com/ie1LmioyA1 — 2z＠AIメーカー (@2zn01) 2018年7月19日 こんにちは、2z（Twitter： @2zn01 ）です。 はじめてのQiita記事です。 今話題のAIをweb上で誰でも気軽に作れる「AIメーカー」を開発しました！ ■AIメーカー https://aimaker.io/ 作ったもの 以下の３ステップで誰でも簡単にAIを作れます！ AIに覚えさせたいタグを入力 タグから自動で画像データを収集 AIがデータ
音響処理の基礎 with CNN 〜機械学習で「太鼓の達人」の自動作譜をしてみた〜 - Qiita
この記事の対象者 音響処理の基礎を概観したい ディープラーニングを用いた音響処理に興味がある 太鼓の達人が好きだ つまり初心者向けってことです。プロの方のツッコミもお待ちしています。 結果 見て（聴いて？）もらうと早いと思います。これは今回作ったモデルで生成した譜面を太鼓さん次郎2で演奏したものです。 米津玄師さんの「ピースサイン」： 「音楽から全自動で太鼓の達人の譜面を作るAI」を作りました またいつか解説記事書きます pic.twitter.com/IW6qrd9knS — うっでぃ (@woodyOutOfABase) July 16, 2018 UndertaleよりToby Foxさんの"Your Best Nightmare" @no_TL pic.twitter.com/UW5ntQg0KC — うっでぃ (@woodyOutOfABase) July 20, 2018 ki
【SIer新人向け】研修では教えてくれないノウハウ集 - Qiita
「ようこそ 魔境 SIerへ！」 はじめに この記事は、SIer（Systems Integrator）に入ったシステム開発未経験者の新人さんたちへ送る、研修では教えてくれないノウハウ集です。 実際、弊社の長い研修では実務に使えそうなことをあまり教えてくれませんし、ノウハウは現場の人の頭にしかない状態なので、新人さんは暗中模索で仕事を覚えていくことになります。 それも非効率なので、実際に私が２年半1で失敗したこと、やってきてよかったこと（ノウハウ）を体系化したので共有します。 新人さんは、これを参考として、使えるところだけ今後の業務に持っていってください。 （本当はガッツリ社内向けに書いたものなので、一部汎用的でない表現がありますがご了承ください。） 目次 業務面 技術面 プライベート面 の三本柱でお送りします。 対象読者 SIerの1,2年目相当であり、学生時代に契約のあるシステム開発を
Linux 作業手順書からべた書きパスワードをなくすシンプルなアイディア - Qiita
※ 2018/07/21 追記。 お読みいただきましてありがとうございます！ すみません、実はタイトルの割には「現在回しているイケてない運用をちょっとした工夫でサクッと改善する」ことを主眼としており、セキュリティのベストプラクティスではありません。。。 本稿の例で挙げているコマンドのリスクにつきましては、 注意 の項を追加しましたのでご参照ください。 公開当初は「10いいねくらいもらえたら嬉しいなー」と思っていた程度だったのですが、まさかここまでたくさんの方に読んでいただけるとは。。。 もっと内容を精査しておくべきだったと反省しております。。。 いいねやコメント等反応頂けるのはとても励みになります。ありがとうございます！ TL;DR 怖いですよね、セキュリティインシデント。 インフラ系でお仕事をしていると、 Linux にログインして操作する手順書を作る事が多くなります。手順書の中には認証
プログラマーの君！ 勘違いするな！ シェルスクリプトでは読みやすさのためにスペースを置くな！！ という話 - Qiita
プログラマーの君！ 勘違いするな！ シェルスクリプトでは読みやすさのためにスペースを置くな！！ という話ShellScriptBash 普通のプログラミング言語での開発に慣れた人ほどシェルスクリプト、特にBashで戸惑う部分の一つに、i = 0のように空白を開ければエラーになるし、かといってif[$i!=0]のように詰めてもやっぱりエラーになる、という点が挙げられます。書きたい物を思うように書けなくて「なんだよこのクソ言語は！！！」とブチギレる人は少なくないのではないでしょうか。この記事では、そのイライラを解消するポイントをお伝えしようと思います。 以下、特に断り無く「シェルスクリプト」と書いている場合はすべて「Bashのスクリプト」という意味になります。zsh等他のシェルではまた事情が異なりますので、ご注意ください。 （※以前プログラマーの君！ 騙されるな！ シェルスクリプトはそう書いち
[Kaggle]0から本当に機械学習を理解するために学ぶべきこと～一流のデータサイエンティストを例に～ - Qiita
「機械学習が出来るようになりたい」そう思いつつも、中々身についた感じがしない。 そんな方々に向けて、Kaggleで公開されているデータ分析の手順を追いかけながら、そこで必要とされている知識を解説したいと思います。全体像を把握することで、より理解が進むはずです。 1. データを分析するために必要な統計的知識 機械学習の目的は未知の事柄を推定することです。そのために既にあるデータから何らかの法則性を見つけ出す為に様々な手法が考えられてきました。 統計学はご存知でしょうか？ 機械学習はデータを扱うという点で統計学と深い関係があります。平均値や標準偏差などは聞いたことがあると思います。統計学はそれらの情報をこねくり回すことによって、限られたデータから本当の全体像を推定します。例えば、選挙の結果を開示前に知りたいときに、投票者全員に聞ければ良いですが、そうもいきません。そこで、統計学は様々な方法を使
![[Kaggle]0から本当に機械学習を理解するために学ぶべきこと～一流のデータサイエンティストを例に～ - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/f4a54c2f823323603e91d6c7e92388fa3e031a8c/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCS2FnZ2xlJTVEMCVFMyU4MSU4QiVFMyU4MiU4OSVFNiU5QyVBQyVFNSVCRCU5MyVFMyU4MSVBQiVFNiVBOSU5RiVFNiVBMiVCMCVFNSVBRCVBNiVFNyVCRiU5MiVFMyU4MiU5MiVFNyU5MCU4NiVFOCVBNyVBMyVFMyU4MSU5OSVFMyU4MiU4QiVFMyU4MSU5RiVFMyU4MiU4MSVFMyU4MSVBQiVFNSVBRCVBNiVFMyU4MSVCNiVFMyU4MSVCOSVFMyU4MSU4RCVFMyU4MSU5MyVFMyU4MSVBOCVFRiVCRCU5RSVFNCVCOCU4MCVFNiVCNSU4MSVFMyU4MSVBRSVFMyU4MyU4NyVFMyU4MyVCQyVFMyU4MiVCRiVFMyU4MiVCNSVFMyU4MiVBNCVFMyU4MiVBOCVFMyU4MyVCMyVFMyU4MyU4NiVFMyU4MiVBMyVFMyU4MiVCOSVFMyU4MyU4OCVFMyU4MiU5MiVFNCVCRSU4QiVFMyU4MSVBQiVFRiVCRCU5RSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9NjdiN2YwOTVlMWM4Yzc4Nzg2YzgzMTJkZWZlZmRkOWY%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB6ZW5vbm5wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1kYjdkZjRhYWU2MzBkZWM2ZjhlYThlMjQ4ZTAxNjRhNg%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D785c46ed4b2354aacb4bdcc0136340ba)
WSL上でDocker Engineが動くようになっていたっぽいという話 - Qiita
経緯 『 太古の昔より人々はWSLでDockerを動かそうとしてきた。 しかしながら、様々な理由からDocker for WindowsやVirtualBoxを頼らざるを得ない状況が続いていた… 』 みたいな認識。 実際ググるとそういうアプローチの記事がよく引っかかる。 WSL(Bash on Windows)でDockerを使用する - Qiita WSLでDockerを使う - Qiita Docker Engineが動かない理由はcgroupだったりSocketだったり様々な要因が絡んでいるのだろうと思っていたし、いつかWSLのアップデートによって解消される問題なのだろうと想像されていた。しかしなかなか解消されなかった。 そんな私もWindows 10の大型アップデートの度に期待をし、失望するというルーチンを繰り返してきた。 しかし、先日こんなツイートを見かけた。 は？いつの間にかd
大規模Vue.jsアプリを開発するときのディレクトリ構成考えた - Qiita
vue-cliのwebpackテンプレートをベースにしてます。 https://github.com/vuejs-templates/webpack/tree/develop/template srcディレクトリ以下は構成をいじっていますが、ルートディレクトリは基本的に webpackテンプレートのままです。 Root:: ├─build ├─config ├─dist ├─static ├─test ├─src │ ├─assets │ ├─components │ │ ├─mixin │ │ ├─partial │ │ │ ├─modal │ │ │ └─plugin │ │ └─pages │ │ ├─member │ │ ├─register │ │ └─.....(etc) │ ├─lib │ │ ├─lang │ │ │ ├─en │ │ │ ├─ja │ │ │ ├─ch │
ReactとVueのどちらを選ぶか - Qiita
主に非Web系のバックエンド開発者(C/C++, Java, Python等を使用)がReactとVueをそれぞれ簡単に触れて、感じたメリット、思ったことなどをまとめています。 色々と書いてますが、どちらも完成度の高いライブラリ/フレームワークですね。 結論 JavaScript等にあまり深入りせずにWebアプリを簡単に書きたい、あるいは効率的に書くことが目的であればVueの方がお勧めです。しかし開発者としてスキルや設計などについて中長期的にレベルアップを図りたいのであれば、Reactから学ぶことをお勧めします。 何故かと言うと、ReactとVueにはそれぞれの利用者に対するスタンスが明確に異なり、Reactの方が利用者を開発者であることを想定/期待しているからです。 Reactは利用者が「開発者」であることを想定/期待します。 What, Whyを重視する 利用者を厳しめに教育する Vu
Repositoryパターンのアンチパターン - Qiita
よく見かけるRepositoryパターンのアンチパターンの紹介と対策です。 Repositoryパターンとは Repositoryパターンとは永続化を隠蔽するためのデザインパターンで、DAO(DataAccessObject)パターンに似ていますが、より高い抽象度でエンティティの操作から永続化ストレージを完全に隠蔽します。 例えばDBコネクションやストレージのパス等はReposiotoryのインターフェースからは隠蔽され、Repositoryのユーザは永続化ストレージが何であるか(例えばMySQLやRedis等)を意識することなく保存や検索の操作を行うことができるようになります。 これによりRepositoryを利用するロジックは業務的な操作に集中できるようになる他、データベースの移行等の永続化層の変更が発生した際にロジックへの影響を切り離すことができるようになります。 // 例) ユーザ
Dockerについてなるべくわかりやすく説明する - Qiita
想定読者 Dockerについてものすごくざっくり知りたい人 ハイパバイザ型とかホスト型とかそう言う話は調査済みもしくはあとで調べればいいと思っている人 Dockerとは Dockerを使えば、OSとアプリがインストールされた環境を閉じ込めて保存しておき、いつでもその環境を立ちあげることができます。"perlをインストールしたUbuntu"とか"JavaとpythonをインストールしたCentOS"みたいな色々なパターンを簡単に作成して保存・立ち上げが可能です。 用語 なるべく事前知識がなくても理解できるようにDockerの用語を冷凍チャーハンに例えて説明します。 ＊厳密性に関してはご容赦ください ファイル系 用語 説明 例えると
GitFlowをやめて本番リリースが楽になった話 - Qiita
背景 サーバーサイド開発のプロジェクトでGitFlow(的な)運用を行っていたが、本番リリースの際に困ることがあったのでgitの運用フローを変えて解消したという話。 まず問題の内容から順番に書いているので、結論(新しい運用ルール)だけ知りたい人はこちら git運用フローについては、GitFlow・GitHub Flow・GitLab Flowなどが有名だがどれとも少し違うように思ったのでまとめた。 <2018/06/10追記> 新フローにも名前が欲しいと思っていたが、同じやり方を「GitFeatureFlow」と呼んでいる記事を見つけた。個人的にもしっくり来たのでこれからはこの呼称を使っていこうと思う。 cf. GitFlowは使わない！シンプルな「GitFeatureFlow」を紹介します </追記終わり> 導入プロジェクトの概要 採用するべき運用ルールはプロジェクトの条件にも依ると思う
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
