이 글은 sachabarbs 님의 글을 번역? 한 것입니다.


https://sachabarbs.wordpress.com/2017/05/15/madcap-idea-part-1-start-of-the-client-side-portion-of-the-web-site/


번역이 매끄럽지 않습니다. 유념하시어 참고만하시기 바랍니다.


MadCap Idea part 1 : 
Start of the Client side portion of the web site


저는 아주 특별한 사람 Peter O'Hanlon 에게 특별한 감사를 표합니다.
Peter O'Hanlon 은 code Project 의 Legend 이며 다방면에서 멋진 친구입니다.
이 엄청난 article 을 검토해도 되겠냐는 저의 요청에 Peter 는 자신의 사업을 운영하는 가족이 있는 사람이며 자신만의 멋진 아이디어를 가졌음에도 불구하고 즉시 예라고 말해 주었고, 일을 마칠수 있게 해주었습니다.
고맙습니다 Peter. 당신께 경의를 표합니다.



실제로 저는 Very 를 (말장난을 용서하세요.) 만들고 싶었지만  단순한 uber type 의 Uber app 을 만들었습니다.  
그 app 에는 다음과 같은 기능적 요구사항이 있습니다.

  • 클라이언트가 사용할 수 있는 web interface 가 있어야 합니다. Client 는 "driver" 가 될수도 탑승하는 "Pickup client(승객)"이 될 수도 있습니다.
  • "Pickup Client" 가 사용할 수 있는  web interface 가 있어야 합니다. 그래서 "Pickup Client" 가 선택한 "Pickup Client" 의 위치를 지도에 표시합니다.
  • "Pickup Client" 는 Pickup 임무를 요청 할 수 있습니다. 이 경우 "Driver" 가 이 임무에 대한 지역에 있는 입찰자 입니다.
  • "Pickup Client" 의 위치는 "Driver" 의 지도상에 보여져야 합니다.
  • "Driver" 는 "Pickup Client" 의 임무에 입찰하며, 입찰한 "Driver(s)" 의 위치는 "Pickup Client" 에게 보여져야합니다. 
  • 입찰에 참여한 "Driver" 의 수락한 정보는 "Pickup Client" 에게 보내집니다.
  • "Pickup Client" 가 "Driver" 를 수락하면 할당된 "Driver(s)" 의 위치만 "Pickup Client" 현재 지도상에 보여집니다.
  • "Driver" 에 의해 픽업되어 "Pickup Client" 가 행복하면  "Pickup Client" 는 "Driver" 를 1~10 점으로 평가할 수 있으면 "Driver" 또한 "Pickup Clinet" 를 1~10 점으로 평가 할 수 있습니다.
  • "Pickup Client" 가 임무를 "완료"로 표시한 후에만 평가를 할 수 있습니다.
  • "Driver" 나 "Pickup Client" 는 항상 자신의 이전 평가를 볼 수 있어야 합니다.

여러분에게는 아이들 장난처럼 보일수도 있지만 (단순히 CRUD 작업을 사용한다면 나에게도 그렇겠지만), 저는 이 App 이 학습경험을 위한 것이기 때문에  간단한 SignalR Hub 와 두개의 database table 을 사용하지는 않을 것입니다.
저는 이 프로젝트를 평소와는 다른 완전히 다른 기술 Set 을 사용하여 작성하려고 합니다.
사용하는 기술의 일부는 초당 수십만건의 요청에도 견딜 수 있도록 쉽게 확장 할 수 있습니다. (Kafka 가 담당합니다.)

사용할 수 있는 가능한 기술들.

  • WebPack
  • React.js
  • React Router
  • TypeScript
  • Babel.js
  • Akka
  • Scala
  • Play (Scala Http Stack)
  • MySql
  • SBT
  • Kafka
  • Kafka Streams
(React/Webpack) 같은 기술들은 다른 blog 에서 다루어졌겠지만 이중 일부는 새로운/통찰력있는 자료가 될 것으로 생각됩니다.
Webpack 에 대해 들어본적이 없어서 새로울 수 있겠지만 여러분에게 충분한 정보가 되길 기대합니다.

천마디 말보다 더 잘 설명하는 한장의 그림이 있습니다.

Demo


Github


다음에 계속 됩니다.


행복한 고수되십시오. ^^


woojja ))*
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\


반응형

'Web' 카테고리의 다른 글

[Web] HTTP Status Error Code  (0) 2013.03.05

+ Recent posts