TypeScriptのIndex typesと Mapped typesを使ってJavaScriptライブラリをIDEで補完する - Qiita
TypeScriptの型定義はアプリの初期設計時に適切な形で導入すれば後の開発が楽になりますが、使うだけならともかく自分で定義するほどには理解が及ばないというケースは多いかと思います。 特に Index types や Index types は扱えると便利なのですが、聞かれると説明に窮することがあり、自分の理解を深めるためにもまとめました。 ※以下の記事は TypeScript3.1.1 が前提です。 EventEmitterを型安全に扱う ありがちですが、 EventEmitter を題材にします。 ほぼこちらの記事の二番煎じです。 TypeScript 2.1 で導入される keyof を使って EventEmitter を定義してみる 以下のように interfaceを定義します。 export type EventDef = {[P in string | symbol]: an
Angularを学習するにあたって参考にした書籍など - Qiita
前置き 以前、仕事でAngular使うことになったので整理するという記事を投稿しました。 あれから少し経って、だんだんAngularのことがわかってきたので、勉強につかった書籍やサイトなどをまとめておきます。 ※Angular 6を使ってた頃の話になります。 書籍 Angular Webアプリ開発 スタートブック Angular Webアプリ開発 スタートブック 最初に買った本です。 適当に寄った書店でAngular関連の本がこれだけ置いてあって、 とりあえず試しに買ってみた本でした。 感想としては、うーん、、、どうなんでしょう。 内容は薄めです。 ハンズオンのような形式で、かなり易しめに書いてありますが、 かゆいところに手が届いておらず、私の欲しかったような内容ではありませんでした。 とはいえ、書いてある通りに実装すれば動くものは作れましたし、それでなんとなく全体像が掴めたようなところは
Babel 7 へのアップグレードにあたっての修正点 - Qiita
これはなに？ とあるリポジトリを Babel 6 から Babel 7 にアップグレードするにあたって、公式のアップグレードガイドを読んで修正が必要だった箇所をまとめたものです。網羅的に記載している物ではないので、細部は公式のアップグレードガイドを参照してください。 公式のアップグレードガイド Upgrade to Babel 7 あわせて Babel 7 Released も読むと、今回のリリースの背景等も知ることができて面白いでしょう。 .babelrc の有効範囲の変更 .babelrc に設定した内容は package.json ファイルを含むディレクトリ配下には適用されなくなっています。 node_modules 配下も同様の制限を受けます。これは monorepo のように複数のパッケージを管理する際の拡張性に配慮した変更のようです。 一方で babel.config.js を
lodash のファイルサイズを lodash-webpack-plugin と babel-plugin-lodash を使って削減する - Qiita
概要 react で SPA を作成していたのですが、webpack-bundle-analyzer をみると、lodash の占める割合が大きかったので、少しでも減らせるような試みとして、 lodash-webpack-pluginと babel-plugin-lodashを使って、 ファイルサイズを削減しました。 利用した主なパッケージのバージョン "babel-core": "^6.26.3", "babel-loader": "^7.1.5", "babel-plugin-lodash": "^3.3.4", "babel-preset-env": "^1.7.0", "babel-preset-react": "^6.24.1", "lodash-webpack-plugin": "^0.11.5", "webpack": "^4.20.2", "webpack-bundle-a
Windows10でWSLを利用したLinuxの開発環境構築 - Qiita
VMはメモリを固定して利用するため、一度に複数起動するのは難しいです。 情報はlinux用が多いです。Windowsネイティブは.exeとかパスが\とか何かと読み替えないといけません。 速度的にはどれもほぼ同じで特に問題はありません。 Windowsネイティブは環境が破壊されます。下手するとWindowsが起動できなくなる可能性もあります。 Windows Subsystem for Linuxの有効化 突然ですが、検索ボックス使ってますか？ ここです。 入力するといろいろ検索してくれます。 通常EdgeでBingの検索結果が表示されるだけなので、使えないって思っている人が多いと思うのですが、PCの内部の検索する場合はここから行うと速い場合が多いです。 というわけでここに「windowsの機能」ぐらいまで入力してください。 そうすると、「Windowsの機能の有効化または無効化」と出てくる
[初心者] Node.jsでHello Worldする - Qiita
Node.jsとは？ 「Javascriptで動作するサーバー環境」 WebサーバーというとApacheやIISなどのHTTPサーバー上でPHPやASPなどを動作させる環境を思い浮かべるが、Node.jsはそれとは異なる Node.jsではサーバーを作るところから実装が始まる 特徴 非同期I/O、ノンブロッキングI/Oモデルを採用している シングルスレッド Googleの「V8」という優秀なJavascriptエンジンで動作する Hello Worldする (Node.jsがインストールされていることを前提としています) とりあえずコードを写経する var http = require('http'); // ① var server = http.createSever(function(req, res) { // ② res.writeHead(200, {'Content-Type
![[初心者] Node.jsでHello Worldする - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/593199dbbbaf41eb6cc664c668d7065823498af9/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMjIyNDUzJTJGcHJvZmlsZS1pbWFnZXMlMkYxNTM0NTQ4MTMzP2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZmbT1wbmczMiZzPWM1YjY1OThlNmQxYjkwNzU4YmI3ZWFhNDFhMjA3NzBh%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D86a9d5d8c5318258d4c08e79326e49d9%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JTVEJTIwTm9kZS5qcyVFMyU4MSVBN0hlbGxvJTIwV29ybGQlRTMlODElOTklRTMlODIlOEImdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz1jZmY5NDU3ZmYyMjgxOGQ2MzA0NjU2OTlhMmJmOWU4NQ%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBob2dlXzU1NTUmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz0xOTRmZTI1YWM5MDgzMzAzYjM4ZTc0MTNkZTFiMDA2NQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Db0382b0aef4b8314bd7006bd33b80e08)
Node.jsで画面遷移を行う - Qiita
Node.jsとは？ [初心者] Node.jsでHello Worldする [初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す わからなければ↑の記事をご参考ください！！ 画面遷移を行う Node.jsでは、リクエスト(URL)ごとにレスポンスとして返却する内容を使い分けることにより、結果として画面遷移を実現させる 以下コード var http = require('http'); var fs = require('fs'); var server = http.createServer(function(req, res) { var target = ''; switch (req.url) { case '/': case '/index': target = './index.html'; break; case '/next': target =
Electron製アプリをMac App Storeでリリースするまでの手順
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 最近、ElectronでGateというMac用デスクトップアプリケーションを作って、Mac App Storeにリリースしました。Gateは、入力したパスのフォルダを、Finderで開くことができるアプリケーションです。Macのパスだけではなく、Windowsパスも開くことができるので、特にMacユーザとWindowsユーザがいるチームでフォルダパスを共有する際に役立つと思います。 Mac App Storeにリリースするにあたり、具体的な手順がわからず苦労したので、今回はリリースまでの一連の流れをまとめてみようと思います。 前提事項
Netlifyに上げたReactアプリのエラーをnetlify.tomlで解決する - Qiita
Overview React App を Netlify へ上げる際に詰まったことがいくつかあり、Netlifyの公式Docsは英語only( https://www.netlify.com/docs/ )で、qiitaなどの日本語記事があまり見られなかったので共有します。 使用した環境は以下です。 node.js v10.7.0 React.js v16.4.1 yarn v1.7.0 困りごと①：環境ごとにビルドコマンドを分けたい Netlifyはかなり便利で、ビルドしたいときにGUIからBuildコマンドを設定するだけで本番環境用ブランチが更新される度に設定されたBuildコマンドを自動で実行してデプロイしてくれます。（しかも無料で！神！） 開発する際は複数の環境を作って開発することがあると思います。（今回は本番環境とステージング環境で開発しようとしていました。） NetlifyのG
結局Yarnは速いのか2018秋 - Qiita
Yarnはキャッシュするので速いという話をよく聞いていて、Yarnしか使ってなかったが、最近npmを使う機会があって気づいたのは、そこまで遅くないなということ。6.xになってから爆速になったという噂もそういえばあった。 *この記事は速さのみに絞っているので、npmはauditがあるだとか、yarnのupgrade-interactiveは至高だとか言う話は置いておきます。 計測環境 MacBook Pro (13-inch, 2018) macOS High Sierra Version 10.13.6 Node.js v10.11.0 npm v6.4.1 Yarn v1.10.1 { "private": true, "dependencies": { "@types/bcrypt": "^3.0.0", "@types/joi": "^13.6.0", "@types/koa": "
【JavaScript】正規表現を駆使して住所部分の文字列だけを抜き出す - Qiita
なぜ？ 住所検索とかのAPIを使う際に、郵便番号やビル情報が不要だった（むしろ、あることで結果を正しく取得できなかったり） Google先生でルートを検索しようとした時、そのままだと「ルート検索」が一発で出てこなかった 2に関しては、以下のような感じ。 「東京都 千代田区紀尾井町1-3 東京ガーデンテラス紀尾井町 ヤフー株式会社」 を検索した場合 「東京都千代田区紀尾井町1-3」 を検索した場合 テストデータ準備 住所のデータは、connpassのAPIを使用して取得した情報を使います。 connpass API リファレンス 御察しの方もいるかと思いますが、APIで取得した住所の表記がまちまちだったのが、そもそも住所部分だけを抜き出そうと思った最初のきっかけです。 実装 まずは最終成果物から。 export function getAddress( orgAddress: string
非同期処理を含むループを同期処理 - Qiita
目的 Promise.allで取得してきたものを順番を崩さずにDBに登録したい。 詰まったところ forEachばかり使っていたので少しはまりました。 forEachはbreakもcontinueも使えないので更に使いどころを気にしようと思います。 非同期処理を含むループを同期処理したい場合はforEachは使えない。 forEachは引数がcallbackになるのでcallback内でawaitを使用するとasync functionではないのでSyntaxError callback内をasync functionに変えて実行したらcallbackが非同期になるのでループが非同期になってしまう。 なのでfor系の文を使うしかない。 コード const _ = require('underscore'); const knex = require('knex')({ client: 'm
Puppeteerで非同期スクレイピング - Qiita
const puppeteer = require('puppeteer'); // Unhandled promise rejection process.on('unhandledRejection', (error) => { console.error(error); process.exit(1); }); const articleUrlList = [ 'https://qiita.com/horikeso/items/0bf9a78454b8124a6dfa', 'https://qiita.com/horikeso/items/f87d3e703828aa13e2ff', 'https://qiita.com/horikeso/items/ec34a8e3d6731a94f5f9', 'https://qiita.com/horikeso/items/bb255eede8
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Angular FormGroupの setValue() と patchValue() - Qiita
[初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す - Qiita![[初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/bfe3a86ad9219c62bb2d71d3dc1be4e5fe5b6e92/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMjIyNDUzJTJGcHJvZmlsZS1pbWFnZXMlMkYxNTM0NTQ4MTMzP2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZmbT1wbmczMiZzPWM1YjY1OThlNmQxYjkwNzU4YmI3ZWFhNDFhMjA3NzBh%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D86a9d5d8c5318258d4c08e79326e49d9%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUU1JTkwJTkxJUUzJTgxJTkxJTVEJTIwJTVCTm9kZS5qcyU1RCUyMGZzJUUzJTgzJUEyJUUzJTgyJUI4JUUzJTgzJUE1JUUzJTgzJUJDJUUzJTgzJUFCJUUzJTgyJTkyJUU0JUJEJUJGJUUzJTgxJUEzJUUzJTgxJUE2aHRtbCVFMyU4MyU5NSVFMyU4MiVBMSVFMyU4MiVBNCVFMyU4MyVBQiVFMyU4MiU5MiVFOCVCRiU5NCVFMyU4MSU5OSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1wYWQ9MCZzPTk5MjQyNTdkMGQyZWQxODNjZDYyZmVhOGFiMTY5NzNj%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBob2dlXzU1NTUmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz0xOTRmZTI1YWM5MDgzMzAzYjM4ZTc0MTNkZTFiMDA2NQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Dbb741db13b4a97388cc7df8b39d67ad0)
【Mac】node.jsインストール方法 - Qiita
【JavaScript】ES6やES2017の構文が使えるか判定する方法 - Qiita
nodeとnpmのアップデートでつまづいたメモ - Qiita
Puppeteerでステータスコード - Qiita
Puppeteerのevaluateに引数 - Qiita
