$ cat front/index.jade
doctype html
html
head
meta(charset='utf-8')
meta(http-equiv='X-UA-Compatible', content='IE=edge,chrome=1')
meta(name='viewport', content='width=device-width, initial-scale=1.0')
title= appName
for cssFile in cssFiles
link(rel="stylesheet", href=cssFile)
// Preloaded Data
script.
window.preloadedData = !{data};
for jsFile in jsFiles
script(src=jsFile)
body
h1= appName
div#content
div(v-view="currentView")
if preloadHTML
script.template(type="v-template", id="template")
!= preloadHTML
doctype html
html
head
meta(charset='utf-8')
meta(http-equiv='X-UA-Compatible', content='IE=edge,chrome=1')
meta(name='viewport', content='width=device-width, initial-scale=1.0')
title= appName
for cssFile in cssFiles
link(rel="stylesheet", href=cssFile)
// Preloaded Data
script.
window.preloadedData = !{data};
for jsFile in jsFiles
script(src=jsFile)
body
h1= appName
div#content
if preloadHTML
script.template(type="v-template", id="template")
!= preloadHTML
$ npm install -g synth
$ $ synth new my_app
Successfully created a new synth app in my_app
ディレクトリ構造
1234567
$ cd my_app
$ ls
back front synth.json
$ ls front/
bower.json css html images index.jade js misc
$ ls back/
back-app.js generateTweets.js package.json resources
こんな感じになっている．
frontはクライアントサイドのやつが詰まってる．
backはサーバサイドのやつが詰まってる．
synth newはTwitterクローンが生成されるみたい．
パッケージインストール
12
$ synth install -b
$ synth install -f
でそれぞれfrontのbower installとbackのnpm installが走る．
起動
12
$ synth server -p 5000
synth (in development mode) is now listening on port 5000
assert = require 'power-assert'
describe 'array', ->
beforeEach ->
@arr = [1,2,3]
describe '#indexOf()', ->
it 'should return index when the value is present', ->
zero = 0
two = 2
assert(@arr.indexOf(zero) is two)
array
#indexOf()
1) should return index when the value is present
0 passing (4ms)
1 failing
1) array #indexOf() should return index when the value is present:
AssertionError: false == true
あれ，，，ログがショボい，，，
123456789101112131415161718192021
array
#indexOf()
1) should return index when the value is present
0 passing (10ms)
1 failing
1) array #indexOf() should return index when the value is present:
AssertionError: # /Users/pochi/Documents/development/(snip)/test/power-assert.js:16
assert(this.arr.indexOf(zero) === two)
| | | | |
| | | | 2
| -1 0 false
[1,2,3]
[number] two
=> 2
[number] this.arr.indexOf(zero)
=> -1
array
#indexOf()
1) should return index when the value is present
0 passing (10ms)
1 failing
1) array #indexOf() should return index when the value is present:
AssertionError: # /Users/pochi/Documents/development/(snip)/test/power-assert.coffee:15
assert(this.arr.indexOf(zero) === two)
| | | | |
| | | | 2
| -1 0 false
[1,2,3]
[number] two
=> 2
[number] this.arr.indexOf(zero)
=> -1
Class HogeView extends Backbone.View
initialize: ->
@listenTo @model, ‘change’, render
do @render
render:->
$oldel = @$el
$newel = $(<render HTML by template engine>)
@setElement $newel
$oldel.replaceWith $newel
次の段落からは簡単な形から流れに沿って最終系になるように説明していきます．
ベーシックなよくある書き方
1234567891011
class HogeView extends Backbone.View
el: '.hoge'
initialize: ->
do @render
render:->
@$el.html ich.hoge_tmpl()
<hoge.jade>
.hoge
script#hoge_tmpl(type="text/html")
p this is hoge
Class HogeView extends Backbone.View
initialize: ->
do render
render:->
@$el.html(<HTML rendering by template engine>)
Class ButtonView extends Backbone.View
el: '.add-btn'
events:
‘click': 'append'
append:->
v = new HogeView()
@$el.append(v.el)
<hoge.jade>
a.add-btn add
script#hoge_tmpl(type="text/html")
.hoge
p this is hoge
class HogeView extends Backbone.View
className: '.hoge'
initialize: ->
do @render
render:->
@$el.html ich.hoge_tmpl()
class ButtonView extends Backbone.View
el: '.add-btn'
events:
'click': 'append'
append:->
v = new HogeView()
@$el.append v.el
<hoge.jade>
a.add-btn add
script#hoge_tmpl(type="text/html")
p this is hoge
class HogeView extends Backbone.View
initialize: ->
do @render
render:->
@setElement ich.hoge_tmpl()
class ButtonView extends Backbone.View
el: '.add-btn'
events:
'click': 'append'
append:->
v = new HogeView()
@$el.append v.el
<hoge.jade>
a.add-btn add
script#hoge_tmpl(type="text/html")
.hoge
p this is hoge
Account Settings を選んで，Two-factor authenticationのSet up two-factor authenticationを選択します．
SMSかアプリか選べと言われるのでSet up using appを選びます．
すると，右側にQRコードが表示された画面になるので，Google Authenticator でQRコードを読み込ませます．
すぐに6桁のコードが表示されるので，2. Enter the 6-digit code that the application generatesに入力してEnableします．
これでめでたくTweetが表示されて，投稿できるようになった．
