본문 바로가기
  • think normal

새로워지기486

부런치_ 루이비통도 넷플릭스처럼(작성 중) 부런치_ 루이비통도 넷플릭스처럼 1) 한줄 평 : 바로 이전에 '아마존 이노베이션' 책을 통해 알게 된 내용들과 궁합이 잘 맞는 내용이 많아 유익한 시간이었다. 특정 사안에 대해 외부에서 접한 솔루션의 경우 - 특히 아마존 - 아무리 탁월해도 각 조직 마다의 환경은 저마다 다르기 때문에 머리로는 이해하고 실무에 적용하기에는 다소 시간이 걸리게 마련이다. 하지만 '루이비통도 넷플릭스처럼'에서는 다양한 환경에서 - 특히 아마존으로부터 위헙을 받는 - 극복하거나 극복의 과정에 있는 상황들에 대한 간접적인 케이스 스터디를 통해 보다 빠르게 실무에 적용해 - 물론 완성이 아닌, 진행 중이지만 - 볼 수 있었다. 만약 '아마존 이노베이션'을 먼저 읽지 않고 이 책을 읽었다면, 어떤 느낌이었을까? 기회가 된다면 나중.. 2019. 7. 25.
아마존 이노베이션, 리뷰 02. 아마존이 국내 시장에 들어온다면? 아마존 이노베이션리뷰 02. 아마존이 국내 시장에 들어온다면? 아마존이 국내 시장에 들어온다면? 생각보다 별일 없을 것 같다. 뿐만아니라 지금의 아마존은 위기이다.아마존은 그것을 인지하고 있기 때문에 스스로를 데코하고 있다고 생각한다. 아- 맞다! 뭐래?! 아니면, 헐, 뜨악- 같은 뇌피셜이다. ;> 그럼 갈 사람 가고 남을 사람 남아서 아래로~ 랫츠 기릿- Why? 01. 어떤 회사도 지금 당장의 핵심 역량을 공개하는 바보는 없다. 예컨데 값비싼 전투기를 판매할 때도 더 신형의 전투기가 나와야 판다. 전투기가 너무 먼 얘기라면 장사꾼을 예로들어보자. 장사 좀 해본 사람은 안다. 장사가 잘 될때 죽는 소리를 하고 안될때는 오히려 떵떵거리며 선심쓰며 잘 된다고 한다. 작금의 아마존이 50보 100보 그렇다.. 2019. 6. 29.
래딧에 대한 연구?같은 거 가입과 동시에 자신의 커뮤니티(하위 래딧)이 생성되었다. in-line 베이스의 싸이월드 느낌인가? 그건 아닌데.. 무튼 개인이 아닌 느낌인데... 문화의 차이인가? 1. 테스트 포스팅을 해보았다. 2. 퍼오기 테스트 (이미지를 못불러오고 있네? 어디에서 발생되는 이슈지?) https://www.reddit.com/user/thinknormal/comments/bysp82/helloworld/?utm_source=share&utm_medium=web2x 불러오는 중입니다... 2019. 6. 10.
[생활코딩따라가기] 예고 목차 우앗~ 오늘 올라온 업데이트 정보 !! https://ko.reactjs.org/?fbclid=IwAR3ZrQ5T0X3Vju0s0ZIattPl3ys807lcTgOXsTD9OVItPvWYG15CgoQJUdo React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 A JavaScript library for building user interfaces ko.reactjs.org 1. 활용 - 기존 홈페이지 react로 개편하기 https://www.normalstory.com/ normalstory think normal, 일상 UX 기획자의 홈페이지 www.normalstory.com 2. 불변성 - https://opentutorials.org/module/4075 JavaScrip.. 2019. 6. 1.
[생활코딩따라가기] React CRUD 중 UD ~ go~ (그전에 수정할 내용) 이고잉은 오류가 안뜨는데 나만 떠는 오류.. JSX문법에 안맞는다는 말인데.. 그래서 뭐가 틀렸단말인가?! 봤더니.. 를 작성하는 경우 ' _ '를 사용하면 안된다는 오류였다. 컴포넌트를 생성하면서 한줄이 추가되는걸 보고 알았다. 그동안은 따라가느라 정신이 없었나보다. 암튼 그동안 작성했던 컴포넌트의 ' _ '를 모두 삭제하니까 말끔해졌다.~ (이제 고고~ 얼마 안남았다~) https://opentutorials.org/module/4058/24861 Update & Delete 기능 구현 - React 수업소개 웹앱의 수정 기능을 React로 구현해봅시다. 강의 - update 구현 코드 변경 사항 강의 - update 구현 : form 작업 코드 변경 사항 강의 - update.. 2019. 5. 29.
[생활코딩 따라가기] REACT, 대망의 CRUD~ 중, create https://www.youtube.com/watch?v=nwwJ2xU7E8w&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=28 1. Create 1. CRUD별 state.mode 값을 변경하기 1) 일단 CUD목록을 만들자 import React, {Component} from 'react'; import './App.css'; import Subject from "./component/Subject" import TOC from "./component/TOC" import Content from "./component/Content" class App extends Component{ constructor(props){ super(props); this.stat.. 2019. 5. 28.
[생활코딩 따라가기] React 16 event 풀~패키지 챕터 https://www.youtube.com/watch?v=kviidk347nU&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=19 수업의 목표 TOC(목차)를 클릭하면 클릭한 항목에 해당 콘텐츠가 목록 아래 영역에 출력될 수 있도록 할 수 있다. 1. Subject의 콘텐츠를 변경하는 이벤트 구현하기 1. React의 특징 이해하기 1) state(또는 props) 값이 바뀌면 화면이 다시 그려진다. - state(또는 props) 값이 바뀌면 그 state(또는 props)를 가지고 있는 컴포넌트의 render()가 다시 호출된다. - render() 2019. 5. 27.
[생활코딩 따라가기] React 15 props와 state https://www.youtube.com/watch?v=rOpg2KUPW2M&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=16 1. 개요 State - 내부에서 컴포넌트를 구현하기 위한 요소(개발자가 내부 구현하기 위해 조작되는 내부 개발 문법 ) Props - 외부에서 컴포넌트를 사용하기 위한 요소(사용자가 컴포넌트를 사용하기 위한 인터페이스) State can be changed (Mutable) Whereas Props can't (Immutable) 2. 이번 수업의 첫번째 목표 아래 노출되어 있는 속성 값을 감춘다. 1) app.js (before) import React, {Component} from 'react'; import './App.css'; .. 2019. 5. 26.
[생활코딩 따라가기] React 12~14 deep dive컴포넌트 여기까지 하면, "나 리엑트 할 줄 알아" 라고 말할 수 있다고 합니다~ 화이팅! https://www.youtube.com/watch?v=pPCC2JWbPgk&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=13 https://reactjs.org/docs/components-and-props.html Components and Props – React A JavaScript library for building user interfaces reactjs.org 1. 목표 app.js에서, 동일한 Tag에 대한 개별 속성까지 조절할 수 있도록 한다. 이 과정은 리팩토링한 효과를 준다. 2. 사용자정의 속성 1) 속성까지 사용자정의 하고자 하는 영역 //*컴포넌트들이 '.. 2019. 5. 26.
[생활코딩 따라가기] React 10,11 컴포넌트 만들기 react의 인프라라고 할 수 있는 컴포넌트 패턴익히기 위한 챕터 https://www.youtube.com/watch?v=QG4RxNHz-bc&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=10 1. 이번 챕터의 목적 컴포넌트를 만드는 패턴을 확실히 내제화 시키기 2. 구현하고자하는 기본 구조 만들기 puer.html WEB world wide web ! HTML CSS JS HTML HTML is HyperText 3. puer.html to react app.js에서 컴포넌트를 활용해서 puer.html 와 동일한 페이지 구성하기 app.js import React, {Component} from 'react'; import './App.css'; //*컴포넌트들.. 2019. 5. 26.
[생활코딩 따라가기] React 7~9.샘플 웹앱 배포 복습 특징 - component 1. 가독성 사용자 정의코드 : ex) 2. 재사용성 3. 유지보수 변경시 모두 적용 목표 1. 개발환경, 어디를 수정할 수 있는지 2. run 실행 3. deploy 배포 실습 전 준비사항 1. 워크스페이스 폴더 생성 2. 해당폴더에서 react 프로젝트 생성 : npx create-react-app space-r1(프로젝트명) React - 7. JS 코딩하는 법 https://www.youtube.com/watch?v=LEPiRfPD9Uw&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=7 1. 화면에 노출되는 코드는 어디인가 public/ 폴더 안에 있는 index.html 의 안쪽에 내가 정의한 component들이 들어가게 된다.. 2019. 5. 26.
인바스켓 휴먼스킬 5.18 일정항쟁, 몰아읽기 쫒기는 일상에서 지적허영을 외치다. 20p) 비지니스스킬과 휴먼스킬은 다르다. 인품. 인품이 좋으면 적이 없고, 주위로부터 신뢰를 받아 결적이나 다소의 실패는 어느 정도 보완될 수 있다. 인품은 내면과 외면을 함께 다루지 않으면 제대로 작동하지 않는다. 사람이 좋아도 품격, 즉 품위가 없거나 불결해 보이면 좋은 인품이라 할 수 없다. 31p) 인품은 사람을 행복하게 하는 힘이다. '행복해 보인다'는 것은 얼굴뿐만이 아니라 행동에도 나타난다. 다만 행복해 보이는 사람이 인품이 있는 것이 아니라, 인품이 있으므로 행복해 보인다는 것이다. 인품은 낙담과 화내는 일에도 금방 회복될 수 있도록 해준다. 까닭은 부위 사람이 협력해주기 때문이다. 어째서 도와주는가? 사람들은 평상시 행복해.. 2019. 5. 18.
[생활코딩 따라가기] React 1~6.샘플 웹앱 실행 생코 React 수업 : https://www.youtube.com/playlist?list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi React - YouTube www.youtube.com 완전 가장~ 따끈 따끈한 the new 수업~ 1. 기기~기본환경 세팅 ( 생코 Link : 04. npm을 이용해서 create react app 설치 ) 1-1) npm 버전확인 npm -v 추가, 참고용 외부 블로그 : https://velopert.com/1351 [Node.js] TIP: Node.js 와 NPM 최신버전으로 업그레이드 하기 | VELOPERT.LOG 이번 포스트는 기존에 node.js 가 설치 되어있는 상태에서 Node.js 와 NPM 을 최신버전으로 업그레이드 하는 .. 2019. 5. 1.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_14 생성자를 통한 상속 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24630 생성자를 통한 상속 - JavaScript 객체 지향 프로그래밍 수업소개 이 수업은 불필요하게 어렵습니다. 동일한 역할을 하면서도 훨씬 이해하기 쉬운 class 상속 수업을 보실 것을 권해봅니다. 물론 보셔도 됩니다. ㅎㅎ 강의1 강의2 코드 constructor-inheritance.js (변경사항) function Person(name, first, second){ this.name = name; this.first = first; this.second = second; } Person.prototype.sum opentutorials.org 14. 생성자를 .. 2019. 5. 1.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_13.prototype과 __proto__ javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24629 prototype vs __proto__ - JavaScript 객체 지향 프로그래밍 수업소개 자바스크립트의 시크릿을 여는 열쇠 prototype과 __proto__에 대해서 알아봅시다. 강의 opentutorials.org 13. prototype과 __proto__ 0. 앞서, 0-1. 자바스크립트는 프로토타입 지향(prototype-oriented) 혹은 인스턴스 기반(instance-based) 프로그래밍 이라고 한다. https://ko.wikipedia.org/wiki/%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85_%.. 2019. 5. 1.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_12.객체와 함수 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24628 객체와 함수 - JavaScript 객체 지향 프로그래밍 수업소개 자바스크립트는에서 함수는 혼자 있으면 개인이고, new가 앞에 있으면 객체를 만드는 신이고, call을 뒤에 붙이면 용병이고, bind를 붙이면 분신술을 부리는 놀라운 존재입니다. 자바스크립트의 함수의 놀라움을 느껴보세요. 강의1 수업의 오리엔테이션입니다. 강의2 call을 통해서 실행할 때마다 this의 값을 변경하는 방법을 살펴보세요. 코드 object_function.js (변경사항) var kim = {name:'kim', first: opentutorials.org 12.객체와 함수 1. .. 2019. 5. 1.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_11.객체간의 상속 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24626 객체 간의 상속 - JavaScript 객체 지향 프로그래밍 수업소개 JavaScript는 객체(인스턴스)와 객체 간의 상속 관계를 자유롭게 설정할 수 있습니다. 이 수업에서는 클래스가 아닌 객체를 통해서 상속하는 방법을 알아봅니다. 강의1 자바스크립트의 상속이 클래스 기반 언어와 어떻게 다른지 소개해드립니다. 강의2 __proto__를 이용해서 상속을 구현하는 방법을 소개합니다. 코드 prototype-inheritance.js (변경사항) var superObj = {superVal:'super'} va opentutorials.org 11.객체 간의 상속 1.. 2019. 5. 1.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_10.super javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24620 super - JavaScript 객체 지향 프로그래밍 수업소개 서브(자식) 클래스에서 상위 클래스를 호출할 때 사용하는 super 키워드를 소개합니다. 강의 코드 class.js (변경사항) class Person{ constructor(name, first, second){ this.name = name; this.first = first; this.second = second; } sum(){ return this.first+this.second; } } class PersonPlus extends P opentutorials.org 10. super 1. .. 2019. 4. 30.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_09. class 상속 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24619 class 상속 - JavaScript 객체 지향 프로그래밍 수업소개 JavaScript에서 클래스를 상속해서 서브 클래스를 만드는 방법을 소개합니다. 강의 코드 class.js (변경사항) class Person{ constructor(name, first, second){ this.name = name; this.first = first; this.second = second; } sum(){ return this.first+this.second; } } class PersonPlus extends Pers opentutorials.org 09. class 상.. 2019. 4. 30.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_06~08 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24614 class - JavaScript 객체 지향 프로그래밍 수업소개 JavaScript ES6부터 포함된 Class 에 대한 소개입니다. 강의1 클래스 문법에 대한 오리엔테이션입니다. 강의2 클래스를 생성하고, 객체를 만드는 방법을 소개합니다. 코드 class.js (변경사항) class Person{ } var kim = new Person(); console.log('kim', kim); // kim.sum = function(){ // return 'this : '+(this.first+this.sec opentutorials.org 06. class JavaS.. 2019. 4. 30.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_05. prototype javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24610 prototype - JavaScript 객체 지향 프로그래밍 수업소개 JavaScript의 prototype이 필요한 이유와 prototype을 통해서 코드의 재사용성과 성능을 향상시키는 방법을 알려드립니다. 강의1 prototype이 필요한 이유를 소개합니다. 강의2 prototype을 이용해서 코드의 재사용성을 높이고, 성능을 향상시키는 방법을 소개합니다. 코드 prototype.js (변경사항) function Person(name, first, second, third){ this.name=name; opentutorials.org 05. prototyp.. 2019. 4. 30.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_02~04 javascript 객체 지향 프로그래밍 생코 수업 Link : https://opentutorials.org/module/4047/24604 객체의 사용 사례 - JavaScript 객체 지향 프로그래밍 수업소개 객체를 실제로 활용하는 사례를 살펴보면서, 객체란 서로 연관된 변수와 함수를 그룹핑하고 이름을 붙인 것이라는 말의 의미를 음미해봅시다. 강의1 이미 우리가 객체를 사용해왔음을 확인해봄으로서 객체가 멀리 있는 것이 아니라는 것을 느껴보는 영상입니다. 코드 built-in.js (변경사항) console.log("Math.PI", Math.PI); console.log("Math.random()", Math.random()); console.lo opentutorials.org 02. 객체의 사용.. 2019. 4. 30.
향기로운 시계에 대하여 시간의 향기 | 문학과 지성사, 한병철 향기로운 시계 중에서 중국에서는 향인 香印 이라고 불리는 향 시계가 19세기까지 사용되었다. 유럽인들은 향인을 20세기 중반까지도 보통 향꽂이인 줄 알고 있었다. 그들에게는 향불의 연기로 시간을 잰다는 생각, 더 나아가서 시간이 향기의 형태를 취할 수 있다는 관념 자체가 아마도 낯선 것이었으리라. (p.94) 침향 도구 향인, 향저 - A.TYPE 침향 도구 향인, 향저 - B.TYPE 부끄럽게도.. 20세기 유럽인들은 차치하고, 나는 그 존재조차 모르고 있었다. 이제야 구글링으로 찾아보지만 만족스러운 검색 결과는 나오지 않았다. 하지만 검색 과정에서 우리나라에도 향 시계가 있다는 사실을 알게 되었다. 고려시대부터 조선시대 말기까지 불가에서 사용된 향전 香篆 이 바.. 2019. 4. 26.
[생활코딩 따라가기] javascript 객체 지향 프로그래밍_01배열과 객체 javascript 객체 지향 프로그래밍 01. 배열과 객체 생활코딩의 새로운? 수업,,, 사실 최근에 리엑트 수업이 떴다... 으흐흐 https://opentutorials.org/module/4047 JavaScript 객체 지향 프로그래밍 수업소개 JavaScript의 객체의 특성을 깊게 살펴보는 수업입니다. 이 수업에서는 아래와 같은 내용을 다루고 있습니다. prototype __proto__ 생성자 함수와 new class 상속 수업대상 클라우드 컴퓨팅에 관심이 있는 학생과 선생님. ac.kr, edu와 같은 도메인으로 끝나는 이메일을 가지고 있는 분들에게만 혜택이 제공됩니다. 수업을 보는 다른 방법 Youtube 재생목록 수업에 참여조건 자바스크립트가 처음인 분은 이 수업을 보시면 opentu.. 2019. 4. 23.
비쥬얼 스튜디오 코드 egoing님 덕분에 오늘?도 새로운 비쥬얼 스튜디오 코드라는 툴을 새로 알게 되었다. '또 새로운 툴이네? 이건 똔 뭐가 다른거야?' 하며 툴툴툴 할 수 있겠지만, 써보면 오호~ 좋은데~ 할꼬다 ㅎㅎㅎ 써보면 여러가지가 편하다. 일단 무료, 동시에 여러 프로젝트를 돌리기 쉽고.. 가장 크게 오는 장점은 터미널을 바로 쓸 수 있다 ^^ 마치 JAVA의 이클립스나 스프링처럼 ^^ 아, 내가 모르는 다른 툴들도 되는거면 쏴리~ 기존에 아톰만 쓰다가 비쥬얼 스튜디오 코드를 보고 화들짝 놀라서 ㅎㅎㅎ 2019. 4. 23.
시간의 향기(문학과지성사-한병철)와 적당한 거리의 죽음(북저널리즘-기세호) 사이에 서서 개인적으로 한병철 님의 책과 북저널리즘 출판사의 책을 수집하고 있다. 그러던 어느 봄날, 포스팅하기 적당한 토요일에, 드문드문 간헐적 독서의 과정에서 두 글에 서로를 바라보는 장면을 목도하게 되어, 이 코끝 찡한 설레임을 간직하고자 몇자 남겨둔다. 시간의 향기(문학과지성사-한병철) | 현재의 역설(p.67) 중에서 길은 장소 자체만큼이나 풍부한 의미론을 자랑한다. 예컨데 순례의 길은 가능한 한 빨리 지나버려야 할 텅빈 공간이 아니다. 순례의 길은 오히려 도달해야 하는 목표 자체의 일부를 이룬다. 이때 길 위에 있다는 것은 많은 의미를 지닌다. 걷기는 참회, 또는 치유, 감사를 의미한다. 그것은 일종의 기도이다. 반면 관광객의 사전에 건너감이 없다. 관광객에게 모든 곳이 여기요. 지금이다. 그는 진정한 의.. 2019. 4. 20.
예민함이라는 무기에 다치지않기 오늘은 등산을 했다. 새로운 길을 걸었다. 짧고 가벼운 코스였다. 그리고 귀가 길에 발견한 손자장 집과 메이커 카페! 오호! 불맛이다. 그리고 이렇게 고기가 많이 든 짜장은 처음이다. 카페는 조용하다. 게다가 3D 프린터와 레이저 커터도 사용할 수 있었다. 이런 곳도 있었구나. 짧은 시간이지만 편한 자리에 앉아 커피를 마셨다. 경치가 참 좋다. 한적한 카페에서 안락한 소파에 앉아 예민함이라는 무기를 다시 꺼내 들었다. 지각은 걸러내기의 과정이다.(p.127) 그런데, 순간 - 뒷 목이 뻐근했다... 뭐지? 오늘 한 거 없이 가볍게 산행만 하고 맛있는 자장과 커피를 마시고 책을 읽고 있는데 왜지? 적어도 세, 네 시간 안에 두통이 몰려오고 있다는 것을 직감할 수 있는 통증이 뒷목과 어깨를 타고 흘렀다. 오.. 2019. 4. 16.
예민함이라는 무기를 만나다 지난 주말 알라딘에서 예민함이라는 무기를 만났다. 심리학으로 분류되는 책이다. 늘 그렇듯 지각의 시작은 타자에 대한 이해가 목적이 었다. 하지만 한장 두장 넘길수록 타인이 아닌 자신에 대한 이해를 이유로 오랫동안 책을 놓지 못했다. 처음에 눈길을 멈춘 글귀다. 주의를 기울인다는 것은 곧 에너지를 그쪽으로 집중한다는 것을 의미한다. 그래서 누군가 나를 사랑스럽게 주목해주면 기분이 좋아진다. 아이들은 이런 에너지를 필요로 하고, 그 사실을 자연스럽게 흡수한다. “엄마 이것 좀 봐요!”라고 외치며 자신에게 주의를 기울여주기를 요구한다. 아이들은 지치지 않고 주목을 요구한다. 심지어 말썽 부려서 받는 주목도 아예 주목을 받지 못해서 에너지를 얻지 못하는 것보다 낫다고 여긴다. (p.118) 나중에 양육을 하게 .. 2019. 4. 16.

티스토리툴바