일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- navigation
- JavaScript
- graphql
- ubuntu
- Push
- 스코프
- 자바스크립트
- JS
- 카카오
- 네이티브
- 배포
- Notification
- 변수
- 알림
- NATIVE
- Express
- MongoDB
- scope
- AWS
- github
- 리액트
- 네비게이션
- Python
- 레이아웃
- 디자인
- 면접
- Background
- EC2
- React
- 후기
- Today
- Total
어서와, 개발은 처음이지?
(안내) 호이스팅의 원리에 대한 글을 추가로 포스팅했습니다. (19.10.13) 자바스크립트의 변수는 다른 언어들과 조금 다르게 동작합니다. 이는 때때로 개발자로 하여금 의도하지 않은 결과를 발생시키기도 합니다. es2015 이후로 let이나 const를 사용하여 예방할 수 있지만 Closure같은 문법들의 효용성을 이해하기 위해서 고전 자바스크립트가 가졌던 특징을 다지고 가는것이 좋겠습니다. var 변수의 의도치 않은 현상 잠시 아래 코드를 보겠습니다. if(true){ var name = 'yuddomack'; } console.log(name); for(var i=0; i
(19.07.11.안내)이론적인 내용이 궁금하시다면 자바스크립트 스코프(scope)도 읽어봐주세요 자바스크립트는 var 문법을 통해 변수를 선언할 수 있습니다. 또한 es2015부터 let과 const라는 문법으로도 선언할 수 있게 되었습니다.모질라 형님들의 문서에 따르면 var은 함수 스코프(function-level scoped), let과 const는 블록 스코프(block-level scoped)를 갖는다고 합니다. 몇가지 예제를 통해 var, let, const의 특징과 함수 스코프와 블록 스코프의 차이점을 알아보겠습니다. 블록 스코프 블록 스코프는 중괄호{ }로 감싸진 범위를 말합니다. if(true){ var variable1 = 'I am in a block'; let variable2 =..
Session 세션은 클라이언트-서버 간 인증 정보를 기록하여, 특정 시간동안 인증절차 없이 사용자를 신뢰하고 서비스 이용에 편의와 여러가지 정보를 제공하는데에 사용됩니다. 세션이 생성되면 세션을 식별할 수 있는 id가 쿠키형태로 클라이언트에 저장되고, 서버에 요청할 때 이 id를 같이 전송합니다. 서버는 이 id로 각 클라이언트를 식별하고, 해당 클라이언트의 세션을 사용합니다. Express Session express-session은 express.js에서 세션관리 기능을 제공하는 미들웨어입니다. 간단한 사용법은 아래와 같습니다. "use strict"; const express = require('express'); const session = require('express-session'); co..
React Native에서 Animated를 사용하여 컴포넌트에 움직임을 넣거나 색상, 투명도 등이 변경되도록 애니메이션을 만들 수 있습니다. Animated는 State나 변수 등을 직접 제어하지 않고, Animated 객체로 생성된 value를 제어하는 것으로 애니메이션을 만듭니다. 애니메이션을 실행하면 시간에 따라 value가 변하는데, 이때 rerender는 이루어지지 않으며 실시간으로 반영됩니다. (rerender와 연관이 없으므로 케이스에 따라 shouldComponentUpdate를 false로 해놓는 것도 좋습니다.) import React, {Component} from 'react'; import {View, Animated} from 'react-native'; type Props =..
이 글은 6.React Native Navigation 기초 - 1부 설치하기 6.React Native Navigation 기초 - 2부 화면 등록, 화면 이동(startapp, push, pop) 6.React Native Navigation 기초 - 3부 기능 살펴보기(현재글)로 구성되어 있습니다. (19.08.05)react-navigation 예제가 추가되었습니다. 이번 글에서는 사이드 메뉴인 Drawer와 그를 통제하기 위한 Deeplink, 그리고 다른 주요 기능에 대해 알아보겠습니다. 1.Drawer Drawer은 좌측 또는 우측에 숨어있는 메뉴입니다. 이 메뉴는 Navigation으로 앱을 실행하는 부분에서 설정할 수 있습니다. Navigation.startSingleScreenApp()..
이 글은6.React Native Navigation 기초 - 1부 설치하기6.React Native Navigation 기초 - 2부 화면 등록, 화면 이동(startapp, push, pop)(현재글)6.React Native Navigation 기초 - 3부 기능 살펴보기로 구성되어 있습니다. (19.08.05)react-navigation 예제가 추가되었습니다. 이번 글에서는 React Native Navigation의 화면 등록과 이동 과정에 대해 알아보겠습니다.근데 매번 풀네임으로 쓰기 너무 힘드네요.. React Native Navigation(이하 rnn)으로 칭하겠습니다. 순환신경망 아니쥬~ 1.일단 예제는 rnn의 깃헙에 들어가셔서 클론하면 Wix 형님들이 만들어두신 example을 사..
이 글은6.React Native Navigation 기초 - 1부 설치하기(현재글)6.React Native Navigation 기초 - 2부 화면 등록, 화면 이동(startapp, push, pop)6.React Native Navigation 기초 - 3부 기능 살펴보기로 구성되어 있습니다. (19.08.05)react-navigation 예제가 추가되었습니다. 우리가 사용하는 일반적인 앱들은 버튼을 누르면 새로운 화면으로 이동하고, 뒤로가기 버튼(혹은 제스처)을 누르면 다시 이전화면으로 이동하는 모습을 볼 수 있습니다. 지난 글에서 3가지 화면(시작 화면, 회원가입 화면, 로그인 화면)을 구현했는데, 그렇다면 리액트 네이티브에서 화면 간 이동이 가능하도록 구현 하려면 어떻게 해야할까요? 바로 N..
이 글은 5.React Native 레이아웃 디자인 - 1부 flex와 width, height 5.React Native 레이아웃 디자인 - 2부 배치(Flex Direction)와 정렬(justify content, align items) 5.React Native 레이아웃 디자인 - 3부 커스텀 버튼 5.React Native 레이아웃 디자인 - 4부 이미지 컴포넌트와 UI 마무리(현재글)로 구성되어있습니다. 바로 이어서 시작하겠습니다. 1.이미지 컴포넌트 이미지 컴포넌트에 이미지를 지정해주기 위해서 source라는 속성을 명시해줘야합니다. source는 {uri : '이미지 주소'}로 외부 주소를 통해 가져오거나 require('로컬경로')를 통해 내부의 이미지를 사용할 수 있습니다. uri와 r..
이 글은5.React Native 레이아웃 디자인 - 1부 flex와 width, height5.React Native 레이아웃 디자인 - 2부 배치(Flex Direction)와 정렬(justify content, align items)5.React Native 레이아웃 디자인 - 3부 커스텀 버튼(현재글) 5.React Native 레이아웃 디자인 - 4부 이미지 컴포넌트와 UI 마무리로 구성되어있습니다. 정신없이 휘몰아치다보면 목적지가 어딘지 깜빡할 때가 있죠. :)우리가 모방하려고 했던 화면의 모습이 기억 나시나요? 혹시 기억이 안나실까봐 다시 가져왔습니다. 자, 우리는 지난시간동안 레이아웃 잡는데 필요한 여러가지 속성을 알아봤습니다.이번에는 5-1번 글에서 작성한 레이아웃을 토대로 화면을 구성할..
(안내) 이 글은 카카오 오픈빌더에 맞추어 새로 작성되었습니다. 카카오 오픈빌더와 외부 API 연동(feat.Nodejs)(안내) 2019년 초부터 카카오 플러스 친구 정책 변경으로 신규 가입자는 본 글에 작성된 방식으로 외부 API를 사용할 수 없고 카카오 i 오픈빌더를 통해서만 스마트 채팅 제작이 가능합니다. 본론에 들어가기 앞서, 카카오 플러스친구는 스마트 채팅이라는 자동 응답기능을 제공하는데요.관리자 페이지의 스마트 채팅 메뉴에 들어가면 FAQ형과 API형을 선택할 수 있습니다. FAQ는 10개 정도되는 질문과 그에 해당하는 답변을 관리자가 미리 입력하여 사용하는 간단한 형태입니다.이에 반해 API형은 챗봇 등에 연결하거나 cs분석을 위해 별도의 DB에 기록하는 등 고객의 대화내용에 따라 여러가지..