Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Front-end Development with Ruby on Rails

3,168 views

Published on

Getting started with Ruby on Rails for front-end development

Published in: Software
  • DOWNLOAD THAT BOOKS/FILE INTO AVAILABLE FORMAT - (Unlimited) ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes Christian, Classics, Comics, Contemporary, Cookbooks, Art, Biography, Business, Chick Lit, Children's, Manga, Memoir, Music, Science, Science Fiction, Self Help, History, Horror, Humor And Comedy, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THAT BOOKS/FILE INTO AVAILABLE FORMAT - (Unlimited) ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes Christian, Classics, Comics, Contemporary, Cookbooks, Art, Biography, Business, Chick Lit, Children's, Manga, Memoir, Music, Science, Science Fiction, Self Help, History, Horror, Humor And Comedy, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • (Unlimited)....ACCESS WEBSITE Over for All Ebooks ................ accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M }
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THAT BOOKS/FILE INTO AVAILABLE FORMAT - (Unlimited) ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes Christian, Classics, Comics, Contemporary, Cookbooks, Art, Biography, Business, Chick Lit, Children's, Manga, Memoir, Music, Science, Science Fiction, Self Help, History, Horror, Humor And Comedy, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • (Unlimited)....ACCESS WEBSITE Over for All Ebooks ................ accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M }
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Front-end Development with Ruby on Rails

  1. 1. Front-end Development with Ruby on Rails fallroot @ LEZHIN Entertainment
  2. 2. 문추근 秋根 @fallroot 레진엔터테인먼트 프론트엔드 개발자
  3. 3. DRY Don't Repeat Yourself
  4. 4. Grunt Gulp
  5. 5. 레진코믹스 2013. 4. 20 개발 시작 2013. 6. 7 서비스 오픈
  6. 6. 레진코믹스 • 하이브리드 앱 • 폰갭 적용 전 마크업, 스크립트 작업 • Grunt, Gulp 등의 도구를 널리 쓰기 전 • 백엔드, 프론트엔드 동시 개발 시작 • 개발 서버 및 초기 데이터 부재
  7. 7. App Engine Java
  8. 8. 앱엔진 + 자바 • 실제 서비스 환경에서 작업하는 방법이 이상적 • 수정 → 빌드 → 배포 과정이 번거로움 • 실제 서비스 데이터를 사용할 수 없음 • 데이터 CRUD가 불편
  9. 9. index.html
  10. 10. index.html • 아주 간단한 작업 • 단일 페이지에 적합 • 단순한 스타일시트 또는 스크립트 테스트
  11. 11. CORS • Cross-Origin Resource Sharing • 원격 자원 접근 제한 • AJAX 호출 시 발생
  12. 12. CORS • JSONP • JSON 데이터를 인자로 받는 콜백 함수 • 브라우저 옵션
  13. 13. CORS security.fileuri.strict_origin_policy Disable Local File Restrictions --disable-web-security Access data sources across domains
  14. 14. 간단한 웹 서버
  15. 15. 간단한 웹 서버 python -m SimpleHTTPServer python3 -m http.server ruby -run -e httpd . -p 3000 php -S 127.0.0.1:8080
  16. 16. 간단한 웹 서버 • HTML 파일 분리 불가능 • 코드의 분리 / 재활용 어려움 • 복사 / 붙여넣기 • 수정 시 같은 작업 반복 • 데이터베이스 사용 불가능 • 임시 HTML 태그 반복 사용
  17. 17. 정적 사이트 생성기
  18. 18. 정적 사이트 생성기 • https://staticsitegenerators.net/ • 레이아웃 지원 • HTML 분리 / 재활용 • YAML, JSON, CSV 등 데이터 사용 • 마크다운 등 블로그 포스팅에 특화 • 환경 설정, 프레임워크 구조 학습
  19. 19. 웹 서버
  20. 20. 웹 서버 Apache Nginx Tomcat
  21. 21. 웹 서버 • 레이아웃 분리 / 재활용 • 사용 프로그래밍 언어 학습 • 서버 환경 설정 이해 • 데이터베이스 사용 가능 • 데이터베이스 설치, 환경 설정
  22. 22. 앱 엔진 + 자바 • 실제 서비스 환경에서 작업하는 방법이 이상적 • 수정 → 빌드 → 배포 과정이 번거로움 • 실제 서비스 데이터를 사용할 수 없음 • 데이터 CRUD가 불편
  23. 23. 루비 온 레일즈 • 간단한 설치 • 루비는 스크립트 언어 • 빌드 / 배포 과정이 필요없음 • 수정 / 확인 과정이 간편 • 기본 기능만으로도 유용 • 추가 젬 설치로 기능 확장
  24. 24. 설치 $ gem install rails
  25. 25. 데이터 배포코딩 jQuery CoffeeScript Sass SQLite Uglifier Scaffold Sprockets
  26. 26. 프리프로세서 CoffeeScript Sass
  27. 27. 프리프로세서 • 원래 언어의 부족한 문법 보완 • 간결하고 효율적인 코드 작성 • 최종 결과물은 원래 언어로 • 추가 젬 설치를 통해 확장 가능 • Less, Stylus
  28. 28. Sprockets • Rack based asset packaging • 스타일시트 / 자바스크립트 파일 관리 • 코드 분리 / 모듈화 • 배포 시 파일 자동 합치기 Rack 루비 웹 서버 인터페이스
  29. 29. Sprockets /* Multi-line comment blocks (CSS, SCSS, JavaScript) *= require foo */ // Single-line comment blocks (SCSS, JavaScript) //= require foo # Single-line comment blocks (CoffeeScript) #= require foo
  30. 30. CSS /*= require reset */ /*= require base */ /*= require home */
  31. 31. JavaScript //= require base //= require util //= require home
  32. 32. Scaffold
  33. 33. https://www.flickr.com/photos/jbgoblin/16174114320
  34. 34. 스캐폴드 • 건축에 사용하는 임시 구조물 • 작업 시 편의 제공 • 건물 완성 후 철거
  35. 35. 스캐폴드 • 레일즈로 15분 만에 블로그 만들기 • 사기!!! • 레일즈 기본 구조 학습 • 프로토타입 / 초기 데이터 관리
  36. 36. 스캐폴드 $ rails g scaffold comic title:string artist:string
  37. 37. 스캐폴드 GET /comics(.json) comics#index POST /comics comics#create GET /comics/new comics#new GET /comics/:id/edit comics#edit GET /comics/:id comics#show PATCH /comics/:id comics#update PUT /comics/:id comics#update DELETE /comics/:id comics#destroy
  38. 38. 시드 # db/seeds.rb Comic.create title: '나쁜 상사', artist: '네온비' Comic.create title: '먹는 존재', artist: '들개이빨' $ rake db:seed
  39. 39. 픽스쳐 # test/fixtures/comics.yml one: title: 나쁜 상사 artist: 네온비 two: title: 먹는 존재 artist: 들개이빨 $ rake db:fixtures:load
  40. 40. 배포 $ rails assets:precompile RAILS_ENV=production
  41. 41. home.js //= require base //= require util //= require comic Sprockets base.js home.js Uglifierutil.js comic.js home.js (minified)
  42. 42. 루비 가족
  43. 43. Pow • 랙 기반 서버 관리 • 웹 서버 포트 충돌 방지 • http://myapp.dev/
  44. 44. Anvil • Pow의 맥 전용 앱
  45. 45. xip.io • 동적 DNS 도구 • http://myapp.10.0.0.1.xip.io • 같은 네트워크 환경에서 사용 • 서버 배포없이 공유 • 여러 기기 테스트 • 빠른 피드백
  46. 46. 유용한 젬
  47. 47. 유용한 젬 • RailsCsvFixtures • CSV 파일을 데이터베이스로 가져오기 • https://github.com/bfolkens/rails-csv-fixtures • YamlDb • 현재 데이터베이스 내용을 YML로 내보내기 • https://github.com/yamldb/yaml_db
  48. 48. 실제 개발 절차
  49. 49. http://web.192.0.0.1.xip.io android.dev web.dev ios.dev Ruby
  50. 50. DRY Don't Repeat Yourself
  51. 51. 감사합니다

×