[B! JavaScript] masayuki14のブックマーク

masayuki14 id:masayuki14

JavaScriptに関するmasayuki14のブックマーク (18)

JavaScript Primer - 迷わないための入門書 #jsprimer
JavaScript Primer 迷わないための入門書 Tweet Watch Star Twitterのハッシュタグ: #jsprimer これからJavaScriptを学びたい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる書籍です。プログラミングをやったことがあるが、今のJavaScriptがよくわからないという人が、今のJavaScriptアプリケーションを読み書きできるように書かれています。初めてのプログラミング言語としてJavaScriptを学ぶ人は、まずは﹁はじめに﹂から読んでみてください。書籍版このウェブサイトの内容はアスキードワンゴから書籍として出版されています。書籍版の内容はウェブサイト版と同一ですが、本として読めるように最適化されています。書籍版は次のサイトから購入できます。 Amazon 達人出版会︵電子書籍版
masayuki14 2020/07/03
あとで読む

javascript
リンク
2018 年は Hyperapp の年だ - Qiita
この投稿はIncrements Advent Calendar 2017 の14日目の記事だよ。Hyperapp という JavaScript ビューライブラリを自作しているので、その説明と作った理由について話す。 Hyperapp ができるまでのプロセスや、どんな価値観で作ったかなどを書く。新しいフレームワークを作る時の参考になれば嬉しい。 Hyperapp とは？ Web アプリのフロントエンド用 JavaScript ライブラリ。React, Preact, Vue といった代表的なものよりもずっと小さく、1 KB という超軽量サイズ。他のライブラリに依存することなく使えて、さらにスピードもある Elmアーキテクチャーに基づいてて、アプリケーション設計はElmやReact、Reduxと似てるけど、ボイラープレートは少ないし、TypeScriptにも対応して、とにかくシンプル。El
masayuki14 2017/12/28
ソースの読めそう感がとてもいい

javascript
リンク
イマドキのJavaScriptの書き方2018
PySpa統合思念体です。これからJavaScriptを覚えるなら、﹁この書き方はもう覚えなくていい﹂︵よりよい代替がある︶というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の﹁旧来の書き方は間違いを誘発しやすいから非推奨﹂というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
masayuki14 2017/12/27
プログラミング

javascript
リンク
ｶﾀｶﾀｶﾀｯﾀｰﾝを可視化した - Qiita
何を言っているのか製作時間 30分ぐらい内容 input要素のtypeがtextまたはsearchの要素、もしくはテキストエリア内におけるキャレットの位置を画面内の絶対値として取得し、その周辺に打鍵と同時に画像を散らかしています。キャレット位置の取得方法これの実現については今回は自前実装ではなく caretposition.jsという素晴らしいライブラリがあったので、使わせていただいてます。 http://d.akiroom.com/2012-06/jquery-textarea-caret-position-javascript-library/ 実装 'use strict'; document.onkeydown = function (e) { var current = document.activeElement; if (e.key === 'Backspace')
masayuki14 2017/12/21
アイデアと実行力が素晴らしい

javascript
リンク
2017末時点での React Component 設計のベストプラクティス - Qiita
どう考えているか、というのを聞かれたので、記事に起こしておきます。個人の意見です。 Prettier を使う気づけばコードの整形を人間がやる時代は終わりました。細かいコーディングスタイルでレビューの時間を取るぐらいだったら、一貫した自動整形ルールを適用すべきです。人によっては細かいこだわりがあって prettier の規則が気に食わないかもしれず、僕も最初はそうでしたが、Atomで保存する度に自動整形を走らせる prettier の強烈な開発体験によって、最終的にそれらのこだわりを全て捨てることが出来ました。生産性を求めるなら、現時点では最優先で導入すべきものです。 React.createClass を使わない v16 で削除されたのでいわずもがな。同様に、 createClass でしか使えなかった mixin 周辺機能も丸ごと deprecated です。﹁可能な限りは﹂
masayuki14 2017/12/19
react

javascript

設計

component

react.js
リンク
Yet Another Bundler - Parcel + Vue.jsの可能性を模索した話 - - Studio Andy
この記事は Vue.js #1 Advent Calendar 2017 - Qiita 15日目の記事です。今年もアドベントカレンダーの季節がやってきました！ブログ書くのは1年ぶりですねw まずはネタ探しということで最近はReact Nativeを書いている時間が長いのもあり、はじめはVue.jsでモバイルアプリが作れるWeexについての記事を書こうといろいろ準備していました。そんな穏やかな冬の午後・・・またなんか出た qiita.com ちょっと待ってくれ先週社内でWebpackの勉強会したばっかなんだけど・・・ ↑↑ やりきった感のある投稿の様子正直、 (ほんともう勘弁してくれ〜〜〜) って感じだしBrowserifyやWebpackをはじめとしたバンドラ論争に振り回されたみなさんの中には怒りすら覚えた人もいるのではないでしょうかとは言っても触ってみないことには良いも
masayuki14 2017/12/15
javascript

vue
リンク
React のソースコードを読んでみよう！ - マルシテイア
こんにちは id:amagitakayosi です。株式会社はてなで主にフロントエンド開発を担当しています。この記事では React 本体のコードを読んでみます！！この記事は Reactアドベントカレンダー 2016 の7日目の記事です。昨日は yutaszk さんで﹁react-router v4 でFlux アプリケーションをHot Module Replacement する﹂でした。目次はじめに (Kyoto.js の宣伝) 準備ディレクトリ構造 monorepo Haste Gulp と Grunt コードリーディング react ReactComponent react-dom ReactMount ReactReconciler ReactCompositeComponent ReactDOMComponent まとめおわりにはじめに (Kyoto.js の宣
masayuki14 2016/12/07
react

kyoto

javascript

コミュニティ
リンク
【翻訳】 2016年にJavaScriptを学んでどう感じたか - Endo Tech Blog
※何度投稿しようとしてもBad Requestが出てしまったのでgistで投稿します。ご了承下さい。 gist.github.com
masayuki14 2016/11/04
javascript

翻訳

仕事

ネタ

歴史
リンク
春からはじめるモダンJavaScript / ES2015 - Qiita
春ですね！人の配置がリファクタリングされ、コードもリファクタリングの季節です。では僕がここでモダンなJavaScriptとES2015の利点を語る役をやるので、みなさんはチームを説得する役をやってください。 JavaScriptの歴史まず最初にJavaScriptの歴史を踏まえることで、今学ぶべきものとその理由を確認しましょう。なぜ2016年の記事でES2016ではなく、ES2015なのか、と疑問に思った方もいるかもしれません。それは、ES2015がただの年次アップデートではなく、これから始まる毎年のメジャーバージョンアップの起点となるバージョンであり、またES5から飛躍的に仕様が増えたバージョンであるからです。簡単に(雑な)歴史を紹介します。ブレンダン・アイクによってNetScapeに実装/搭載された古の時代〜IE6 (1996~2005) ES3: 一時はシェア7割を誇ったレ
masayuki14 2016/03/17
まとめ

*開発

javascript

node

gulp

babel
リンク
優秀なJavaScriptの開発者になるための5か条 | POSTD
(注記‥7/15、いただいた翻訳フィードバックを元に記事を修正いたしました。) 子供の頃、私の興味は互いに関係性のない様々な分野に及んでいました。数学も歴史も大好きでした。ルネッサンスマン、つまり博学者と言う、複数の分野に秀でた人になりたいと思っていました。これはとても難しい課題で、私は突如として、器用貧乏な人になってしまう危機に直面したのです。私は特定の分野に特化しなくては、と考え始めました。そうすればたとえルネッサンスマンにはなれなくても、少なくとも、器用貧乏にならなくても済むと思ったのです。どうしたらソフトウェア開発をするのに必要な広い知識を保ちながら、1つの分野で専門性を高めることができるのでしょうか。この記事では、過去5年間、私が良いJavaScript開発者になるために使ったテクニックとリソースの概要をお伝えしようと思います。最近の多くのWeb開発者は、ある共通の
masayuki14 2015/07/15
javascript

知識

ソフトウェア

web

あとで読む

プログラミング

勉強

学習
リンク
Grunt/Gulpで憔悴したおっさんの話 | MOL
先人たちが1年前に通った道で、いろいろいまさらかよって話なんですが。基本的に以下の記事読んだら分かります。要はGulpとかGruntといったモノ使わずにnpm run hogehogeでビルドしよーぜって話です。 task automation with npm run オレ的Gruntに対する最新の気持ち - from scratch Node - npm で依存もタスクも一元化する How to Use npm as a Build Tool // package.json "scripts": { "start": "npm run start-serve & npm run watch", "test": "stylestats public/files/css/maple.css", "start-serve": "browser-sync start --server publ
masayuki14 2015/03/27
node.js

node

gulp

grunt

npm

build

javascript
リンク
新着記事
『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。
masayuki14 2014/10/11
テクニック

フレームワーク

tips

Web

bootstrap

css

javascript

webデザイン
リンク
Node.jsの開発を超速化するGitHub連携三種の神器 - teppeis blog
Node.js Advent Calendar 2013 - Adventar 9日目です。あまりネタを用意する時間がなかったので、GitHubにNode.jsのリポジトリを置いたりnpmにパッケージを公開したりしたときに便利な定番サービスを3つ紹介します。 Travis CI Coveralls David タイトルは釣りですが、特にTravisとCoverallsは一度体験すると離れられないぐらいほんとにlife changing。コードをpushしたらブランチのビルド結果をプルリクに表示してくれたり、カバレッジ結果をコメントで書き込んでくれるので、それを見ながらコーディングを進めていけます。これが無料なのは意味不明なぐらいの神です*1。サンプルコードはこちらのプロジェクトで見てください。 Github: https://github.com/teppeis/fixclosure
masayuki14 2014/01/08
ci

GitHub

開発

javascript

node.js

travis

TravisCI

node

development

coverage
リンク
http://phonegap.com/
masayuki14 2012/07/30
iPhone

開発

HTML5

javascript

PhoneGap

android
リンク
ウェブ制作の時間を大幅に短縮する、今時のUIコンポーネントが簡単に実装できる -Chico UI
HTML5+CSS3+JavaScriptで制作されたオープンソースのUIコンポーネントコレクションを紹介します。 Chico UI [ad#ad-2] Chico UIの対応ブラウザは下記の通りです。 IE6には対応していませんが、十分でしょう。対応ブラウザ Google Chrome Safari Firefox 4+ Internet Explorer 7+ Opera Chico UIのウェブページに使用するさまざまなUIコンポーネントを紹介します。と、その前にレイアウトとグリッドから。
masayuki14 2012/03/02
UI

web制作

css3

html5

フレームワーク

javascript

WEBデザイン
リンク
「jQuery Mobile」の登場で、モバイルアプリケーション開発は大きく変わる－ Publickey
このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である具体的な
masayuki14 2011/02/15
web制作

jQuery

JavaScript

mobile

html5
リンク
少しのコードで実装可能な20のjQuery小技集
2016年6月22日 jQuery 素敵な動きを手軽に実装できるJavaScriptライブラリ﹁jQuery﹂。jQueryには多くのプラグインが揃っていますが、以前書いた﹁少しのコードで実装可能な20のCSS小技集﹂に続き、今回はプラグインなしで実装できるjQueryの小技を紹介します！﹁jQueryってなんだ？﹂という人もコピペで実装できますよ！サンプルも用意したのでぜひご覧ください！ ↑私が10年以上利用している会計ソフト！追記‥この記事で紹介されているいくつかの方法が、今ではCSSのみで実装可能です！詳しくは﹁かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技﹂をご覧ください。 jQueryの基本的な使い方まずはjQuery本家からjQueryファイルをダウンロードします。<head> 内に下記を記述し、jQueryファイルを読み込みます
masayuki14 2011/01/25
jQuery

tips

まとめ

javascript
リンク
IBM Developer
IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant techno logies such as generative AI, data science, AI, and open source.
masayuki14 2010/03/08
javascript

json
リンク
1