Riot Pug Sass Typescriptで楽にWebページ・アプリを開発 (概要編) - Qiita
前提 bashが動く && 動かせる node v8.+ が動く(nodebrew推奨) nodeやnodebrewはこちらの記事が非常に参考になります。 対象 最近の開発環境に触れてみたい方 直接FTPクライアントでサーバー側のファイルをいじってる方 ある程度Webの知識がついてきて、更に何かしたい方 タイトルの開発環境が欲しい方 概要 皆様、現状の開発環境に満足しておられますでしょうか。Webというものは派閥が多く、Angularだ、Reactだなんて言われているご時世ですが、そういったナウいものに手を出すには些か学習コストがかさむことが踏ん切りを邪魔してしまいがちです。 新しくて、便利なものを使っていきたいけど、難しいこと抜きでお願いしますって方は意外と多いのではありませんでしょうか？ そんな方々に朗報！！！！ タグのカッコや綴じタグの呪縛から開放してくれるPug 同上をCSSに持ち
【サーバレス】Firebaseとriotでweb開発を試す - Qiita
レガシーエンジニアがサーバレス+SPAやってみた 普段はLAMP+cakePHP+bootstrapのレガシーエンジニアがサーバレスを試してみました。はたしてJSだけでどこまでできるのか？ サーバレス気になる→Firebaseがイケてるらしい。mBaaSだがwebでもいけるみたい。 React、Angular、Vueはなじめなかった→マイナーだがriotというのが簡単らしい。 bootstrap、jquery止めたい→フロントよくわからないのでひとまずMaterialDesignLite。 LambdaとかCognitoは面倒だった→正直認証とか自動でやって欲しい。 認証、文章と画像の投稿と一覧表示まで適当にサンプル https://newagent-db971.firebaseapp.com/ ゲストユーザー test@test.com/testtest ※デザインとかほぼテンプレのまま
webpackでriotのcssをコンパイルしたい - Qiita
const postcss = require('postcss'); const prefixer = require('autoprefixer')({ browsers: ['last 2 version'] }); module.exports = { // ・・・省略 module: { rules: [ // ・・・ { test: /\.tag$/, exclude: /node_modules/, use: [{ loader: 'riot-tag-loader', options: { hot: 'false', style: 'postcss', parsers: { css: { postcss: (tagName, css) => postcss([prefixer]).process(css).css } } } }] } ] } }; 実行すると以下のエラーが出
Riotでイベントの最中にエレメントを消した場合の挙動 - Qiita
Riot.jsなどのJavaScriptフレームワークを使うと、簡単に要素を出したり消したりできます。ただ、時にはそれでややこしい現象になることもあります。 イベントが…うまく伝わらない Riotで作ったモジュールで、「確認済み - 未確認」の状態を制御するものを作っていました。 確認ボタンは未確認の状態でだけ出る 確認ボタンは<button type='submit'>になっていて、押したら確認フラグをセットしてあとはフォーム送信に任せる というような形となっていました。ところが、この確認ボタンを押すと、確認フラグをセットしてボタンを消す…ところまでは動くのですが、ブラウザによってその後に送信されるかされないかが違ってくる、という状況になってしまいました。 原因 どうやら、「イベントを送ったエレメントをイベント中に削除した場合」にどうなるかが、ブラウザによって違ってくるようでした。あるブ
backboneの基礎の基礎 第1回[サーバからデータ取得せずにローカルで動かす] - Qiita
仕事でbackbone、marionetteをやってます。 jqueryは使った事があったけど、backboneとかのMVCレベルのフレームワークは使った事なかったので、 (JavaとかではstrutsなどのMVCは経験あり)理解するのに手こずりました。 同じような人の理解に役立てれればなぁと思っております。。。 いきなりサーバサイドとの組み合わせでやるとかなり複雑になるなと感じたので、 backboneを基本から簡単に理解できるように数回にわけて書きたいと思います。 まず第1回目として、backboneの一番いいとこといっても過言でないRESTは実装せずに、 ローカルのみで、しかも超簡単な画面を通して、基本的な構成を書きます！ 今回のゴールの画面はこれ フットサルのメンバー紹介サイト。2人のメンバーの名前と生年月日、ポジションがただ表示されているだけの画面。 まぁ、これならHTMLだけで
![backboneの基礎の基礎 第1回[サーバからデータ取得せずにローカルで動かす] - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/ee6a648ec3b73534c27dd773e68e1c2c85b8252c/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%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGNzkyMTQlMkZwcm9maWxlLWltYWdlcyUyRjE1MjE5NDIyOTU_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmZtPXBuZzMyJnM9ZDQzZTIxZDIwOWFiMmNiYWFhNjQ3OWI0NDUzMjNkY2I%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D6e9be90d589536b83ab8b98d2be0958e%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9YmFja2JvbmUlRTMlODElQUUlRTUlOUYlQkElRTclQTQlOEUlRTMlODElQUUlRTUlOUYlQkElRTclQTQlOEUlMjAlRTclQUMlQUMxJUU1JTlCJTlFJTVCJUUzJTgyJUI1JUUzJTgzJUJDJUUzJTgzJTkwJUUzJTgxJThCJUUzJTgyJTg5JUUzJTgzJTg3JUUzJTgzJUJDJUUzJTgyJUJGJUU1JThGJTk2JUU1JUJFJTk3JUUzJTgxJTlCJUUzJTgxJTlBJUUzJTgxJUFCJUUzJTgzJUFEJUUzJTgzJUJDJUUzJTgyJUFCJUUzJTgzJUFCJUUzJTgxJUE3JUU1JThCJTk1JUUzJTgxJThCJUUzJTgxJTk5JTVEJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9ODUyNzYxNTQ3ZDczZDQ0MzI4NWUzNWQxZGEyOTVlMDI%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBuYWthNDYmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz1hNGExOGQzMGJkODcwMDlhNzEzMGMwZDZjM2I0NTUxOQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3De43ae9a916aa72f63ac12b70d1c57097)
Backbone.MarionetteアプリをWebpackでバンドルする - Qiita
Webpack 今まで、Browserlifyを利用していましたが、Webpackに切り替えました。Webpackの方が使い方も簡単で、これからモジュールバンドルを利用される方は、Webpackを使う方がいいのではないでしょうか。 なんでもjsへ変換してくれます。 バンドルサンプル バンドルの例として以下のようなモジュールを利用するWebアプリのバンドル方法を示します。全体はGithubに置いてあります。 https://github.com/notice/backbone-marionette backbone backbone.marionette jade lodash jquery Backbone.Marionette 最近では、少し古く感じてしまうBackboneですが、Marionetteの方はv3（現時点最新はv2.4）へ向けて開発が進められています。 v3ではMarion
jQueryの処理はComponentに書く - Qiita
開発ツールで確認。 コードもjQueryもangularによってscripts.bundle.jsにまとめられてる。 htmlのヘッダにscripts.bundle.jsの呼び出し宣言もつけてくれている。 …でも、どうにも実行されていないっぽい 対応 jQueryの処理は、Componentの中に書く！ そもそも宣言されてるだけでただの飾りになってるのでは？と思い Component内に移植してやるとうまく動きました import { Component, OnInit } from '@angular/core'; // jQuery用の変数宣言 declare var $; @Component({ selector: 'main-component', templateUrl: './main.component.html' }) export class MainComponent
温泉で回転寿司 - Qiita
http://togetter.com/li/1050610 をみて突発的にOnsenUIで回転寿司してみました。 無駄にVueJSも使ってますｗ 結果はこちら(Monacaで作ってます) ソースは /* フッターの背景 */ div#footer-bk { width:95%; /* 横の幅を100% */ height: 32px; /* アイコンサイズにする */ position: absolute; /* 絶対位置指定することを定義 */ bottom: 32px; /* 絶対位置指定(左0px,下0px) */ padding: 0px 0px, 0px, 0px; /* 上下に余白を取る */ overflow: hidden; } /* フッターの表示領域 */ div#footer{ border: solid #fff; /* 表示領域を白枠で囲う */ } <!DOC
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
gas で Underscore を使いたいとき - Qiita
erb に Lodash.js (or Underscode.js) の _.template を書くときのエスケープ - Qiita
riot.js click demo - Qiita
Laravel Mix に Riot の設定をしたい（少数派） - Qiita
続・Riot.jsの落とし穴まとめ - Qiita
Riot.jsで要素を`each`させると"Uncaught TypeError: Cannot read property 'root' of undefined" - Qiita
riotタグにjsonで連想配列を渡してやるとvalueが消える件 - Qiita
Backbone.MarionetteアプリをBrowserifyでバンドルする(Grunt編） - Qiita
Backbone.MarionetteアプリをBrowserifyでバンドルする(Gulp編） - Qiita
Yeomanのgenerator-backboneを使って開発環境を作ったときの覚書 - Qiita
Javascriptで花火地図 - Qiita
angular6 の i18n で生成した xlfファイルをマイクロソフトの多言語アプリ ツールキットで編集可能にする - Qiita
