전체 글 (19) 썸네일형 리스트형 Swagger Swagger는 Open API Specification(OAS) 프레임워크이다. 종종 API를 확인하기 위해 API서버 도메인에 연결하면 이러한 화면을 볼 수 있다. API 서버에 정의된 각 API 함수들이 어떤 데이터를 주고받는지 확인할 수 있으며, 어떤 동작이 이루어지는지 테스트해볼 수도 있다. API서버를 개발하는 단계에서도, 정의한대로 데이터가 입출력 되는지 확인해볼 수 있어 유용하다. Swagger 의 최대 장점이자 특징은 자동화이다. 정의된 API를 목록화하여 보여주기 위해 UI를 설계하고, 소스코드를 직접 입력하여 화면을 구성한다고 가정하면, 어떤 변경사항이 있을 경우, 각각의 코드를 직접 수정해야하지만, Swagger는 알아서 자동으로 해준다. 일일이 수정할 필요 없이, API 함수만 수.. npm unpublish npm 커맨드 중 publish 된 패키지의 버전을 취소할 때 사용. 정상적인 경우 사용하지 않는 커맨드. npm unpublish [/][@] 모든 unpublish된 패키지의 새 버전은 24시간이 지나기 전에는 새로 publish 되지 않을 수 있다. Flex 내가 처음 웹퍼블리셔로 일을 하게 되었던 재작년 그땐 들어볼 일이 별로 없었던 것이 어느날 눈에 띄더니 계속 눈에 띄고 있다. 바로 flex-box 이다. 웹 브라우저에 표현되는 요소들은 기본적으로 수직방향으로 순차적으로 표현된다. CSS를 다 걷어낸 상태의 HTML 문서를 브라우저에서 열어보면 알 수 있다. 하지만 간혹 우리는, 그리고 우리의 클라이언트들은 어떠한 것들을 수평방향으로 나열하고 싶어한다. 그럴 경우 고전적으로 FLOAT을 이용하거나, TABLE, inline-block속성 등을 이용하여 이것들을 표현해왔다. 하지만 충돌 등의 문제가 있어왔고, 이 방법들은 그렇게 놓을 수 있는 대체방법이었을 뿐 수평으로 배치하는 것에 대해 제대로 정의된 속성이 없었다. 그러다가 나타난 것이 FLEX의 개념.. React Native 1 일단 여기에 쓴다. React Native로 앱을 만드는 미션. 하지만 RN은 써본적 없기 때문에 동영상 강좌를 보면서 따라하기로 했다. 이사님이 추천해주신 강좌를 보는데 Youtube에서 Nomad coder라는 유튜버를 보게 되었다. 콜롬비아인 니콜라스님과 한국인 린님의 합작. 둘이 무슨 관계인지는 관심 없으니 https://youtu.be/p_v_js0mxVc 일단 뭘 걸어야 할지 몰라 어떤 프로그래밍 언어를 쓰는게 좋을지에 대하여 만든 영상 링크를 걸어본다. 각설하고, 요점은 이것이다. React Native client를 사용하여 개발을 할것인가, 아니면 Expo를 사용할 것인지 이다. Expo란 React.js의 Create-react-app 과 마찬가지로 기본 앱을 만들어주도록 프로그래밍 된.. HTML&CSS 카테고리 포스팅의 시작 2016년 7월부터 6개월간 직업전문학교에서 국비지원과정으로 웹퍼블리셔 교육을 받았다. 반년간 교육을 받았지만, 아무래도 부족함이 많았다. 마지막에 좋은 선생님께 좋은 내용으로 많이 배우긴 했지만, 여러가지 이유로 수료 직후의 상태는 역시 지금 생각하면 역시나 부족할 수밖에 없었다. 퍼블리셔로 처음 입사한 곳은 준공기업, 공공기관 등의 하도급으로 프로젝트에 기획, 디자인, 퍼블리싱 파트로 참여하는 회사였다. 그곳의 대표님의 요구사항이 국비지원출신 신입이 감당하기에는 너무나 버거운 수준이었고 사수도 없었지만, 다행히 프로젝트의 기간이 길었기 때문에, 깊이있게 고민하고, 삽질할 수 있었다. 사실상 그곳에서 일한 반년이 내 퍼블리셔로써의 경험과 실력의 절반정도를 차지한다고 생각한다. 그 후 빠르게 찍어내는 회.. JS_ES6_1. var키워드와 let키워드 젠장. 참고서적 언급 등을 쓰기 위해 잠시 임시저장하고 새로글을 써서 발행했더니, 작성하던 임시저장이 날아갔다 ㅡㅡ;; 1. var 키워드 var 키워드는 변수 선언에 사용된다. 흔히 지역변수라고 부르는 로컬변수, 전역변수라고 부르는 글로벌변수로 구분한다. 로컬변수는 함수나 오브젝트를 스코프로 사용하기 위한 의도, 글로벌변수는 프로그램 전체에서 공용으로 사용하기 위한 의도로 선언되는 변수이다. one = 100; function get(){ one = 300; console.log("함수 :", one); } get(); console.log("글로벌 :", one); 여기서 one이라는 변수는 var를 사용하지 않았으므로 글로벌 변수이다. get()함수를 호출하게 되면, get()함수블록 안에 있는 o.. JavaScript ES6 포스팅 JavaScript ES6 내용에 대한 포스팅은 루비페이퍼에서 출간한 ECMAScript 6 책으로 공부하는 내용을 기록한다. 업무적인 필요성, 그리고 JQuery 에서 벗어나기 위해 ES6를 익일 필요성을 느끼고 있다. ES5까지는 함수작성을 위한 언어로의 역할만 하던 Javascript가 ES6에 들어서면서 객체지향언어로써의 비중이 커졌다고 한다. Node.js나 React.js를 사용하면서 이런 부분을 처음 접했고, 기존에 퍼블리셔로써 jQuery를 매우 많이 사용했는데, 이 라이브러리의 장점인 편리함에 젖어 jQuery적으로만 생각하고 있는 스스로를 발견했고, 프론트엔드로 넘어가는 부분에 있어서 많은 어려움을 느꼈다. 한국에서 프론트엔드라는 영역에 들어가기 위해서는 기본적으로 ES6는 필수라고 생.. Ubuntu에 Node.js 설치하기 1. curl 을 설치해준다. => sudo apt-get install -y curl 2. build-essential을 설치해준다. => sudo apt-get install -y build-essential 3. curl 을 통해 nodejs를 설치해준다. => sudo curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -- => sudo apt-get install -y nodejs 4. node.js 의 버전을 확인해준다. => node -v 5. npm의 버전을 확인해준다. => npm -v 이전 1 2 3 다음