hack atom with node.js

60
Hack Atom w/ Node Kenju Wagatsuma

Upload: ken-william

Post on 10-Jan-2017

2.628 views

Category:

Engineering


1 download

TRANSCRIPT

Page 1: Hack Atom with Node.js

Hack Atom w/ Node

Kenju Wagatsuma

Page 2: Hack Atom with Node.js

/* * Introduce Myself * * @kenjuwagatsuma */

Page 3: Hack Atom with Node.js

'me' = { name : 'Kenju Wagatsuma ( KJ )’,

}

Page 4: Hack Atom with Node.js

'me' = { name : 'Kenju Wagatsuma ( KJ )’, company : 'Recruit Technologies Co.,LTD.',

}

Page 5: Hack Atom with Node.js

'me' = { name : 'Kenju Wagatsuma ( KJ )’, company : 'Recruit Technologies Co.,LTD.', profession : 'Android Development',

}

Page 6: Hack Atom with Node.js

'me' = { name : 'Kenju Wagatsuma ( KJ )’, company : 'Recruit Technologies Co.,LTD.', profession : 'Android Development', career : { 2011 : 'Graphic Designer ( PS, AI, ID )' 2013 : 'Web Designer ( HTML+CSS, jQuery)' 2014 : 'Web Engineer ( JavaScript )' 2015 : 'Programmer ( Java/Android )' } }

Page 7: Hack Atom with Node.js

Me * Node =

Page 8: Hack Atom with Node.js

Me * Node = Not Professional (Just for fun)

Page 9: Hack Atom with Node.js
Page 10: Hack Atom with Node.js
Page 11: Hack Atom with Node.js
Page 12: Hack Atom with Node.js
Page 13: Hack Atom with Node.js
Page 14: Hack Atom with Node.js
Page 15: Hack Atom with Node.js
Page 16: Hack Atom with Node.js
Page 17: Hack Atom with Node.js
Page 18: Hack Atom with Node.js
Page 19: Hack Atom with Node.js

/* * What Atom? */

Page 20: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub

Page 21: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub ❖ Specialized variant of Chromium

designed to be a text editor

Page 22: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub ❖ Specialized variant of Chromium

designed to be a text editor ◎ asset pipelines

Page 23: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub ❖ Specialized variant of Chromium

designed to be a text editor ◎ asset pipelines ◎ access to local files

Page 24: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub ❖ Specialized variant of Chromium

designed to be a text editor ◎ asset pipelines ◎ access to local files ◎ asynchronous module definition

Page 25: Hack Atom with Node.js

Atom is: ->❖ Project supported by GitHub ❖ Specialized variant of Chromium

designed to be a text editor ◎ asset pipelines ◎ access to local files ◎ asynchronous module definition ◎ script concatenation

Page 26: Hack Atom with Node.js

https://speakerdeck.com/zcbenz/practice-on-embedding-node-dot-js-into-atom-editor

Page 27: Hack Atom with Node.js

https://speakerdeck.com/zcbenz/practice-on-embedding-node-dot-js-into-atom-editor

(Before Electron)

Page 28: Hack Atom with Node.js

/* * Why Atom? */

Page 29: Hack Atom with Node.js

Why Atom: ->❖ Play with Node API ❖ FS, HTTP, Stream, Async methods…

Page 30: Hack Atom with Node.js

Why Atom: ->❖ Play with Node API ❖ FS, HTTP, Stream, Async methods…

❖ Always running on the newest Chromium ❖ No more polyfill ❖ Can ignore browser compatibility

Page 31: Hack Atom with Node.js

Why Atom: ->❖ Play with Node API ❖ FS, HTTP, Stream, Async methods…

❖ Always running on the newest Chromium ❖ No more polyfill ❖ Can ignore browser compatibility

❖ Support from GitHub teams ❖ Long-term development

Page 32: Hack Atom with Node.js

/* * How Atom? */

Page 33: Hack Atom with Node.js

❖ 1. Contribute to Atom Editor

❖ 2. Contribute to Atom Packages

❖ 3. Write Your Own Atom Package

You can: ->

Page 34: Hack Atom with Node.js

❖ 1. Contribute to Atom Editor

❖ 2. Contribute to Atom Packages

❖ 3. Write Your Own Atom Package

You can: ->

Page 35: Hack Atom with Node.js

* * @param x : ?(mental) * @param y : ?(skill) * @param z : ?(grammer) * @return ? */ contribute(x, y, z): -> while x.isExist doYourBest

Page 36: Hack Atom with Node.js

* * @param x : Passion * @param y : Node * @param z : CoffeScript * @return ? */ contribute(x, y, z): -> while x.isExist doYourBest

Page 37: Hack Atom with Node.js

❖ 1. Contribute to Atom Editor

❖ 2. Contribute to Atom Packages

❖ 3. Write Your Own Atom Package

You can: ->

Page 38: Hack Atom with Node.js
Page 39: Hack Atom with Node.js
Page 40: Hack Atom with Node.js

/* * We Need Your Help! */

Page 41: Hack Atom with Node.js

❖ 1. Contribute to Atom Editor

❖ 2. Contribute to Atom Packages

❖ 3. Write Your Own Atom Package

You can: ->

Page 42: Hack Atom with Node.js

Atom API: ->Clipboard Color Cursor Directory File GitRepository KeymapManager TextBuffer ThemeManager …etc

Page 43: Hack Atom with Node.js

Get Started: ->

‘cmd-shift-p’

then

‘Package Generator’

… That’s it!

Page 44: Hack Atom with Node.js

Package: ->

This is the basic package layout.

`lib` file is the core of the packages:

***-view.coffee ***.coffee

Page 45: Hack Atom with Node.js

Debug: ->

It’s based on Chromium, right?

Page 46: Hack Atom with Node.js

Test: ->

Oh, my princess Jasmine♥

Page 47: Hack Atom with Node.js

Publish: ->

`apm publish` is what you’re looking for.

Run `apm publish -h` for help

Page 48: Hack Atom with Node.js

/* * Conclusion */

Page 49: Hack Atom with Node.js

❖ 1. Contribute to Atom Editor

→ Please do if you can :)

❖ 2. Contribute to Atom Packages

→ A lot of rooms for improvement

❖ 3. Write Your Own Atom Package

→ Super Easy

You can: ->

Page 50: Hack Atom with Node.js

Read this: ->

https://atom.io/docs/v1.1.0/

Atom Flight Manual

Page 51: Hack Atom with Node.js

Ask Here: ->

https://discuss.atom.io/Atom Discuss

Page 52: Hack Atom with Node.js

Join us: ->

https://atomio.slack.com/Atom Slack

Page 53: Hack Atom with Node.js

Atom is really hackable

Page 54: Hack Atom with Node.js

Atom is really hackable

powered by Node.js

Page 55: Hack Atom with Node.js

Atom is really hackable

powered by Node.js

and you are Node Professional!

Page 56: Hack Atom with Node.js
Page 57: Hack Atom with Node.js

http://bit.ly/nodefest2015kj

Thanks;

Page 58: Hack Atom with Node.js

/* * Appendix */

Page 59: Hack Atom with Node.js

❖ Release Notes ➡ https://atom.io/releases

❖ API References ➡ https://atom.io/docs/api/v1.1.0/Atom

❖ Blog ➡ http://blog.atom.io/

References: ->

Page 60: Hack Atom with Node.js

❖ “node-webkit” by Cheng Zhao ➡ https://speakerdeck.com/zcbenz/

node-webkit-app-runtime-based-on-chromium-and-node-dot-js

❖ “Atom” by John Nunemaker ➡ https://speakerdeck.com/

jnunemaker/atom

Best Slides: ->