Top Banner
Fullstack Javascript
44

Fullstack javascript. Isomorphic apps

Jul 16, 2015

Download

Internet

Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Fullstack javascript. Isomorphic apps

Fullstack Javascript

Page 2: Fullstack javascript. Isomorphic apps
Page 3: Fullstack javascript. Isomorphic apps

Нормальный Разработчик

Page 4: Fullstack javascript. Isomorphic apps

Javascript Разработчик

Page 5: Fullstack javascript. Isomorphic apps

Но все начинают с

Page 6: Fullstack javascript. Isomorphic apps

Шаг 1

Page 7: Fullstack javascript. Isomorphic apps
Page 8: Fullstack javascript. Isomorphic apps

Шаг 2

Page 9: Fullstack javascript. Isomorphic apps
Page 10: Fullstack javascript. Isomorphic apps

Шаг 3

Page 11: Fullstack javascript. Isomorphic apps
Page 12: Fullstack javascript. Isomorphic apps

Шаг 4

Page 13: Fullstack javascript. Isomorphic apps
Page 14: Fullstack javascript. Isomorphic apps

Шаг 5

Page 15: Fullstack javascript. Isomorphic apps
Page 16: Fullstack javascript. Isomorphic apps

Шаг 6

Page 17: Fullstack javascript. Isomorphic apps
Page 18: Fullstack javascript. Isomorphic apps

Шаг 7

Page 19: Fullstack javascript. Isomorphic apps
Page 20: Fullstack javascript. Isomorphic apps

И еще

Page 21: Fullstack javascript. Isomorphic apps

Mean.io подход

Page 22: Fullstack javascript. Isomorphic apps

Package is everything

Page 23: Fullstack javascript. Isomorphic apps

Package is everything

User Sponsors Events Orders

Mean.io infrastructure

Page 24: Fullstack javascript. Isomorphic apps

Темы

Project

PackagePackage

Page 25: Fullstack javascript. Isomorphic apps

Mean.io CLI

Users

Packages

Misc

Page 26: Fullstack javascript. Isomorphic apps

Solid package structure

Package

Orders

UI router UI controller UI Model Backend router MongoDB

Page 27: Fullstack javascript. Isomorphic apps

Client package structure

Package

Orders

UI router UI controller UI Model

Page 28: Fullstack javascript. Isomorphic apps

Server package structure(add)

Package

Orders

Express router Controller Model

Page 29: Fullstack javascript. Isomorphic apps

Но этого ли мы хотим?

Page 30: Fullstack javascript. Isomorphic apps

Мы хотим

● Перформанса

● SЕО

● Простую поддержку

Page 31: Fullstack javascript. Isomorphic apps
Page 32: Fullstack javascript. Isomorphic apps

Как должно работать

App

Orders

Router Controller Model

Page 33: Fullstack javascript. Isomorphic apps

И никакого разделения

Page 34: Fullstack javascript. Isomorphic apps

DerbyJS подход

Page 35: Fullstack javascript. Isomorphic apps

Flow

Browser DB

Model

LiveDB

ShareJS

Page 36: Fullstack javascript. Isomorphic apps

Flow

Browser DBModel

Page 37: Fullstack javascript. Isomorphic apps

Rendering

Browser

Route

ServerRoute

Route

Page 38: Fullstack javascript. Isomorphic apps

Что если...

Я не хочу перерисовывать всю страницу?

Page 39: Fullstack javascript. Isomorphic apps

Не перерисовывайте!

Page 40: Fullstack javascript. Isomorphic apps

Transitional routesRoute

From To

Forward Back

Page 41: Fullstack javascript. Isomorphic apps

Traditional routes

Page 42: Fullstack javascript. Isomorphic apps

Transitional routes

Page 43: Fullstack javascript. Isomorphic apps

Syncable/unsyncable

Syncable Unsyncable

Page 44: Fullstack javascript. Isomorphic apps

QA

@[email protected]