일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- create-next-app
- 카라쿠
- react 스프레드
- 후쿠오카 스타벅스
- react hooks
- 리액트 이벤트 핸들링
- 카라쿠 커리
- nextjs typescript
- react nextjs
- 삿포로 공항
- nextjs prettier
- codepen
- typscript react
- react
- react map
- nextjs redux
- nextjs eslint
- react hook typescript
- 스타벅스
- nextjs redux example
- redux example
- typescript hooks
- 일본스타벅스
- nextjs
- next typescript example
- typescript next
- NODE_PATH
- typescript react next
- 일본 아메리카노 가격
- 신겐라멘
- Today
- Total
목록분류 전체보기 (38)
일안하고블로그
카카오톡 이모티콘 선물하기 카카오톡 이모티콘을 웹사이트로 선물 해보겠습니다. 카카오톡 이모티콘샵으로 들어가보겠습니다. 사이트는 여기를 클릭해주세요. 우선 사용중인 계정으로 로그인을 합니다. 다음 선물해줄 이모티콘을 검색합니다. 저는 에비츄를 선물 할 계획입니다. 다음, 이모티콘을 고릅니다. 고르고 나서 선물하기 클릭합니다. 그런다음 선물을 할사람을 선택해주세요. 결제를 진행합니다. 아래 이미지 참조하세요. 결제가 완료되면, 선물을 받은 계정으로 카톡알림이 옵니다. 선물 보러가기를 누르면 다운로드를 받을 수 있어요. 다운로드 완료 되면 사용 할 수 있어요.
스타벅스 카드 어쩌다 한번씩 스타벅스에가서 계산을 할때 모바일 App으로 결제를 정말 많이합니다. 마실 음료를 선택하고, 결제를 하고 마지막에 묻는 게, "현금영수증 하시겠습니까?"인거같은데 매번 전화번호를 누르기는 하지만 번거롭게 해드리것같아 미안한 마음이 있어서 종종 현금영수증을 하지않았습니다. 우연히 웹사이트에서 현금영수증을 하는 방법이 있다고 하여 정리해서 올립니다. 1. 스타벅스 웹사이트에 접속하여 로그인 합니다.스타벅스홈페이지 2. 상단에 My Starbucks 클릭후 -> 개인정보 수정 클릭 3. 인증후 개인정보 페이지에서 현금영수증 정보입력을 발행하지않음 에서 개인으로 변경 이렇게 하면 변경이 완료됩니다.
평소 개발을 할때 ES6를 사용 할 수 있는 환경이 되어서 ES6 문법을 더 효율적으로 사용을 하려고 하지만, 습관이 되어 버린 문법 습관과 제이쿼리를 사용하는 환경으로 많이 사용 하지 않게 됩니다. 그래서 조금더 왜 더 ES6가 효율적이고 편한지 알기 위해서 정리를 해보려고 합니다. 가장먼저, 변수선언에 대해서 정리를 해보겠습니다. 기존 자바스크립트와 다른 ES6의 Keyword는 varconstletscopeHoisting첫번째 var은 자바스크립트에서 쓰는 변수 선언 방법입니다. 그리고 const와 let은 ES6에서 사용하는 변수 선언 입니다. 각각의 변수선언은 차이가 있는데 차이점과 예시를 통해서 설명을 하겠습니다. var예제 See the Pen var 변수선언예제 by 최대한 (@sheldh..
React fetch 작업파일은 여기를 클릭해주세요.리액트에서 데이터를 받아올때는 어떻게 받을까? 라는 생각을 해본 적이 있을거에요.그냥 단순히 Jquery 라이브러리를 불러서 사용을 해야하는 것인지 아니면, 다른방법이 있는지 고민을 하다가 처음 알게된 라이브러리는 fetch 입니다. 하지만 이것도 쉽지 않았습니다. 왜냐면 여러개를 테스트 해보고 싶은데 마땅히 테스트 해볼것도없고..유튜브를 보면서 정리를 해보았습니다. 리액트에서 쓰는 API Citent REST API는 fetch / SuperAgent / axios 가 있습니다.(다른 방법도 더찾아보면 있을거에요) 여기서 제가 선택해서 사용 할 것은 fetch(native) 와 axios입니다. fetch는 ajax역할만 하는 라이브러리인데, 사용법은..
코드팬을 사용 할때 또하나의 좋은 기능이 있습니다.깜박하고 공유를 못해드렸는데 https://codepen.io/sheldhe/pen/JBKxEZ 내가 작성한 글을 다른사람도, 링크를 클릭하여 들어가지않고 보게 하는 방법이 있습니다. 공유하는 방법은 Iframe을 사용하거나, HTML소스를 받거나, 등등 방법이 있어요. 저기있는 코드팬의 결과값 / HTML/CSS/Js 소스를 보여줄거에요. 위에 코드펜이 뭐지하시면 하단에 글 참조하세요.2018/07/18 - [사이트 & 프로그램 추천] - codepen 사용하는 방법은, 제가 만든 Pen을 예시로 설명을 드리겠습니다. 다시 여기 링크로 들어가보세요. 캡쳐한 화면처럼 나올거에요. 여기에서 우측하단에 Embed 라는 버튼이 있어요. 이버튼 누르면 .. 이러..
평소에 CSS에 대한 것들이나 구글링 하거나 CodePen을 사용하다 보면 항상 SCSS 라는 단어와 Sass라는 단어를 자주 보게 됩니다. CSS에 관련된 것인데 문법을 보니까 어려울것같고, 해서 미뤄왔지만 이제 정리를 해야 할때가 왔습니다. 저는 리액트 프로젝트 스타일링은 SCSS로 할 것이기 때문에 SCSS를 쓰면 어떻게 편한지 왜좋은지를 알아야합니다. 우선, Keyword 부터 적어 보겠습니다. CSS PREPROCESSORSASSSCSSCSS PREPROCESSOR 한글로 해석하면 CSS 전처리기라고 하는데 말이 너무 어렵습니다. 쉽게, CSS가 동작을 하기전에 사용하는 기능입니다. 리액트를 하면서 주로 사용하는 CSS 전처리기는 Sass/SCSSpostCSSLessStylus 이렇게 있어요. ..
CODEPEN 사이트 : https://codepen.io/ 사이트 자체 이미지하면 검정색 하고 흰색 이 떠오르네요.코드팬은 주로 자바스크립트 / CSS / HTML를 테스트 할때 사용합니다. 저는 사이트에 있는 모든 기능을 사용하진않고 , 주로 테스트를 하거나 , 예시 소스를 보거나 , 눈 정화용으로 사용하곤 합니다. 사이트가 오픈소스 사이트이지만 저작권이 있는 소스들도 있어서 모든 것이 무료는 아닌 사이트입니다. PRO 버전이 거의 저작권이 있는 소스인 것같아요. 사이트가 미리 테스트를 할때 정말 유용합니다. 작업을 하면서 천천히 사용법을 적어 보겠습니다. 회원가입https://codepen.io/accounts/signup/user/free 무료 유료 설정하는 것이 있지만 무료로 만들었습니다. 로그..
Redux 작업 파일 다운로드는 여기를 클릭해주세요.FaceBook 팀이 만든 Javascript 라이브러리입니다. React만 사용해도 어플리케이션을 개발 할 수 있으나, 어플리케이션의 규모가 커지고 복잡해지면서, state관리가 복잡해 졌습니다. Redux는 복잡한 state관리를 단순하게 처리할 수 있게 도와줍니다. Redux의 3원칙- 지금 꼭 이해할 필요는 없어요. 1. 모든 상태는 하나의 Store로 구성2. 상태는 읽기전용이다.3. 변화 함수는 순수 함수로 작성해야한다. 1. Flux 와 차이점인데, 쉽게 한개의 Store라는 것을 관리한다고 보면 됩니다. 2. 상태(State)를 변경하려면 action이라는 객체를 전달하는 방법 뿐입니다. action 개념은 하단에서 예시를 보면서 이해하면..