React+Redux+Express+MongoDBでものすごくシンプルなCRUDアプリをつくる - Qiita
概要 React+Redux+Express+MongoDBでCRUDアプリを作ります。 この記事の目的は、React/Reduxを触り始めた人が サーバーとの通信の方法（より一般的には非同期処理の方法） Reduxにおけるフォームの扱い ExpressによるAPI node.jsからのMongoDBの操作 Herokuへのデプロイ など、主にサーバー側のデータの操作に関わる基本的な事項を学ぶきっかけを作ることです。 この目的に集中するために、それ以外の点については一切気にしないことにします。 そのため、初心者以外の人（上記の内容を理解している人）がこの記事を読んでも得るものはないと思います。 この記事が書かれた背景には、少し前に自分自身がjavascriptによるフロントエンド開発からwebプログラミングを学び始めたころの経験があります。ReactやReduxの基本的な文法の理解を終えて
Home · takahashiakira/tech_for_web Wiki · GitHub
Technology for Web Developers Webエンジニアリングに関するトピックで、フロントエンドをメインにバックエンドやインフラ周りまで、個人的にまとめたドキュメントを公開してます。 なんの気なしに公開していたドキュメントでしたが、最近急激に読者が増えてきて、そろそろ内容も古くなってきたこともあり今後真面目にメンテナンスや運用方法を検討中です。 ※本Wikiは内容が古かったり誤りがある可能性がありますのでご了承ください。 ※内容に致命的な問題を発見した場合はお気軽にご指摘ください。 Front-end FEのためのJS基礎 これだけ覚えるべきJSの基礎 現場で使うjQuery FEの実践的なJS頻出表現 フロントエンド環境構築とnpm CommonJSモジュール運用 JS小規模なView設計 JSモジュール設計 ReactとRedux Reactの基礎 Reactの実践
Riot.js+Webpackの構成 - Qiita
{ "name": "asset", "version": "1.0.0", "description": "", "main": "webpack.config.babel.js", "scripts": { "watch": "webpack --watch --progress" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.22.1", "babel-loader": "^6.2.10", "babel-preset-es2015": "^6.22.0", "babel-preset-es2015-riot": "^1.1.0", "riotjs-loader": "^4.0.0", "webpack": "^1.14.0" }, "dependencies": { "riot":
カスタムタグ · Riot.js
カスタムタグの例 Riotのカスタムタグは、ユーザインターフェースの構成要素です。 アプリケーションの「ビュー」部分を担います。Riotのいろいろな特徴をハイライトした、TODOの例の拡張から始めましょう。 <todo> <h3>{ opts.title }</h3> <ul> <li each={ items }> <label class={ completed: done }> <input type="checkbox" checked={ done } onclick={ parent.toggle }> { title } </label> </li> </ul> <form onsubmit={ add }> <input ref="input" onkeyup={ edit }> <button disabled={ !text }>Add #{ items.length
Node.js+Express.js+log4js - Qiita
$ cat package.json { ≈≈≈ "dependencies": { "express": "~4.13.1", "log4js": "^0.6.37", ≈≈≈ }, ≈≈≈ } $ mkdir modules $ cat modules/logger.js var log4js = require('log4js'); log4js.configure({ "appenders": [{ "category": "access", "type": "dateFile", "filename": "/var/log/nodejs/access.log", "pattern": "-yyyy-MM-dd", "backups": 3 }, { "category": "system", "type": "dateFile", "filename": "/var/log/no
1分でわかるESLintの使い方とインストール手順
ESLintとは JavaScriptのコードが正しいかチェックするツール。 以下の手順で簡単にインストールして使用可能。 バージョンは6.8.0のものなので使用バージョンによっては質問内容が異なる場合がある。 1. npmをインストールする https://nodejs.org/ 2. ターミナルを開く ターミナル(コマンドプロンプト)でESLintをインストールするディレクトリに移動 cd ディレクトリのパス 3. ESLintをインストールする npm i -g eslint または sudo npm i -g eslint 4. ESLintの初期設定を行う eslint --init How would you like to configure ESLint? と表示されるので「To check syntax, find problems, and enforce code s
Riot.jsの落とし穴まとめ - Qiita
はじめに 軽量かつ学習コストも低めで書きやすいライブラリのRiot.jsですが、いわゆる落とし穴がいろいろあります。が、このライブラリに関する日本語の記事があまり多くなく、コード書いていると突然「あれっ！？」となることがたまにあるので、自分が知っているものを書いていきます。 ※執筆現時点でのバージョンは2.4.1です。 ※2016/11/10追記 既に3.0.0-alpha.13がリリースされた今、2.4.1なんて古いバージョンを使っている方はいないと思いますので、今の時点での2系の最新である2.6.7でも確認しました。 親タグマウント時に子タグもマウントされる タグ(.tagのこと)がネストしていると、親タグをマウントすると子タグも一緒にマウントされます。 例えば以下の様な場合、親タグ（appタグ）で何か処理する必要があって、その結果でマウントする子タグを決めたい場合、子タグ（child
Diff to HTML - 差分をHTMLに変換
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました プログラマーであれば差分をよく使うかと思います。基本的にCLIで実行するか、GUIの差分ソフトウェアで確認するでしょう。筆者はCLIをよく使います。 patchファイルの形式でもいいですが、Side by Sideのが見やすいこともあります。そこで使ってみたいのがDiff to HTML、GitのDiff情報をHTMLにしてくれるソフトウェアです。 Diff to HTMLの使い方 Diff to HTMLの表示です。GitHubのものに似ていますね。 変更されたファイル一覧も取れます。 1カラムだけでなく、サイドバイサイドもサポートされています。 Diff to HTMLはGitHubに近いデザインなので、見慣れた使い勝手になるでしょう。オフラインでも使えるのがいいですし、ローカ
npm googleapisのインストールに失敗する場合 - Qiita
失敗箇所を見つけるために、-loglevel verboseオプションをつける 必要なパッケージを見つけ、個別にインストールする 手順1 npm i --save googleapis -loglevel verbose エラー箇所の目星 npm info postinstall request@2.65.0 npm verb unlock done using /... / この辺りで止まれば、request@2.65.0をインストールする ` 手順2 npm i --save パッケージ名 -loglevel verbose 手順3 再度、googleapisをインストールする 問題があれば手順2を繰り返す うちの環境では10個をくらい個別でインストールした 原因は不明 Register as a new user and use Qiita more conveniently You
15分で分かったつもりになるAngular 2 概要/angular2
Angular 2 の特徴を美味しいところだけ凝縮してお届けします
Node.jsの「構築事例」、そして「向いていること」と「向いてないこと」 - Qiita
Node.jsはシングルスレッド、ノンブロッキングI/O、イベントループなどの特徴があり、「向いていること」と「向いていないこと」があると思います。 言語選定の際に使えるメモとして、Node.jsの構築事例も加えてまとめてみました。 Node.jsに「向いていること」 処理が短時間でイベント処理が重要なアプリ 例えば、チャットアプリなどの大量のアクセスのあるリアルタイムなネットワークプログラミングが得意 シングルCPUのサーバー シングルCPUの環境化でもその性能を十分使い切れるため、比較的性能の小さいサーバ上で大きなパフォーマンスを発揮できる Node.jsに「向いていないこと」 CPU負荷の高い処理 CPUリソースを大量に必要とするJavaScriptの処理を行うとイベントループが回らない状態になり、イベントハンドリングが行えない状態に陥る。このため、CPU処理が大量に必要とされるアプ
aglex: API Gateway + Lambda + Express4 で サーバレス API を作成する - Qiita
API Gateway + Lambda の構成は、素で作成すると個別の endpoint の登録作業が膨大でかなり面倒なため、何かしらのフレームワークを使わないとメンテできない問題があります。 個人的に Express で開発したものをほぼそのまま Lambda 化する仕組みを作って運用していたのですが、安定運用出来ているのと体裁がほぼ整ってきたのもあるので aglex として公開しました。 特長 Express で作ったものが（ほぼ）そのまま Lambda 化できる Lambda function が1つにまとまるので、メンテがしやすい Lambda function、API Gateway をコマンドで簡単に作成・更新できる Lambda の実体は Express を call するための薄い wrapper なので動作も軽く、凝ったことをしていない限りは Express で書いたコ
pageres-cliで複数デバイスのスクリーンショットを一括作成 - Qiita
pageres-cliをインストールすると、コマンドラインから手軽に複数サイズのスクリーンショットを作成することができる。 レスポンシブサイト作成時の表示確認や、資料作成などに活用すると便利。 必要な環境 Node.js インストール方法 ターミナルから以下のコマンドを実行。
npm でコマンドラインツール開発事始め - Qiita
node.js で Gmail API を叩きたい (https://github.com/takayukioda/cmail) 軌跡その2 Gmail をコマンドラインで確認できるツールを作りたい． 開発言語は興味あるけど中々手が出せてなかった node.js で作りたい． そんなわけで node.js の簡単な使い方を勉強 node.js のインストール node.js のインストール方法は色々ある 公式ホームページからダウンロードしてインストール Homebrew 等のパッケージ管理ツールからインストール nvm 等の node 用のバージョン管理ツールを利用してインストール などなど． 自分はバージョンが頻繁に変わるらしいという事で nvm をインストールして，そこから最新版をインストールした． プロジェクトの作成 Node でプロジェクト情報を package.json に書くの
expressで国際化！i18n-nodeを使おう - Qiita
はじめに Railsの国際化の記事は多いのですがexpressがあまりない悲しみ。基本的な流れはそんなに変わらないと思いつつ置いときます。こちらの環境はNode.JS 0.12.x + express4.9です。 express4のアプリを多言語化する まずはi18nを入れましょう。githubのリポジトリ名はi18n-nodeですが、npm名はi18nです。 var app = express(); var express = require('express'); var session = require('express-session'); var i18n = require("i18n"); //・・・中略・・・ // i18nの利用設定 i18n.configure({ // 利用するlocalesを設定。これが辞書ファイルとひも付きます locales: ['ja', '
My 7 Node.js mantras
I’ve been using Node.js professionally since 3 years (with the help of 13 years of dev. experience in C, C++, PHP, Perl, Javascript, etc.) ; and like everyone else, I’ve faced a lot of (recurring) problems. I solved some using my Javacript knowledge but for the majority, I did it with the help of the community (mostly StackOverflow and Freenode). From this experience, I taught myself 7 mantras for
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptタスク自動化のもう一つの選択肢、「gulp」の利用法