react-native 특정버전으로 프로젝트 생성하기

React & React Native 2018. 10. 17. 22:39

react-native  0.57.2 버전으로 프로젝트 생성할 경우 버그가 많아서 ,버전을 낯춰서 프로젝트를 생성하기로 하였다.


react-native init --version="0.57.0" ProjectName




'React & React Native ' 카테고리의 다른 글

리액트란? (React)  (0) 2018.10.21
TouchableOpacity  (0) 2018.10.18
FlexBox 레이아웃이란? (2)  (0) 2018.10.17
FlexBox 레이아웃이란? (1)  (0) 2018.10.14
default node version 변경하기  (0) 2018.10.14
블로그 이미지

클라인STR

,

FlexBox 레이아웃이란? (2)

React & React Native 2018. 10. 17. 21:51

flexWrap 은 상위 컨테이너 공간이 부족할때  항목을 어떻게 wrap 하는지 결정한다. 

  • nowrap : 모든 요소를 한 줄에 정렬한다.
  • wrap :  요소들을 여러줄에 걸쳐 정렬한다.
  • wrap-reverse :  요소들을 여러 줄에 걸쳐 반대로 정렬한다. 

flexBox는 1차원 모델이지만 항목을 여러줄로 묶을수 있다. 이때 사용하는 속성이 flewWrap 이다. 

'React & React Native ' 카테고리의 다른 글

TouchableOpacity  (0) 2018.10.18
react-native 특정버전으로 프로젝트 생성하기  (0) 2018.10.17
FlexBox 레이아웃이란? (1)  (0) 2018.10.14
default node version 변경하기  (0) 2018.10.14
리액트네이티브 디바이스 정보 출력 react-native-device-info  (0) 2018.10.11
블로그 이미지

클라인STR

,

FlexBox 레이아웃이란? (1)

React & React Native 2018. 10. 14. 23:43

Flexbox는 CSS3릐 레이아웃 모드이다.  block이나 inline과 같은 기존의 레이아웃 모드와 달리 flexbox는 레이아웃을 만들 때 배치하는 방향을 지정할 수 있다. 

리액트 네이티브는 flexbox에 상당히 의존적이다.

flex는 flexible의 줄임말로 유동적인 레이아웃을 쉽게 만들수 있다는 의미이다.


React Native에서의 FlexBox는 CSS에서와 마찬가지로 동일한 방식으로 동작하지만 몇가지 예외가 존재한다. 


  • flexDirection 은 행대신에 열을 기본값으로 사용하고 있다.
  • flex 매개변수 지정시 단일 숫자값만 지원한다.

리액트 네이티브에서 사용할 수 있는 flexbox 속성은 다음과같다. 

  • flex
  • flexDirection
  • flexWrap
  • alignItems


flex 속성은 display: flex 지정된 부모컨테이너 속성과 같다고 생각할 수 있다. 해당 컨테이너에 배치된 요소를 항목이라고하며 다음과같은 구조를 가진다. 



각 컨테이너는 flex-start 와 flex-end 포인트를 가진다. Flex는 주축 (Main axis) 교차축 (Cross-Axis)이 있다. 가로 축은 주축이고 세로축은 교차축 이다. 

가로축은 flex-direction 정의된다.  flex-direction 속성을 row 또는 row-reverse를 선택한경우 ,행을 기준으로 인라인방향으로 실행된다. (가로방향)


     column 또는 column-reverse 선택하면 주축이 페이지 위에서 아래쪽으로 블록 방향으로 실행된다. 

flex-direction 기본값은 행 (Main-axis)이며 왼쪽에서 오른쪽으로 이동되나, 원점은 변경될수 있다. row-reverse 할경우 원점은 오른쪽이다. 




https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox 





'React & React Native ' 카테고리의 다른 글

react-native 특정버전으로 프로젝트 생성하기  (0) 2018.10.17
FlexBox 레이아웃이란? (2)  (0) 2018.10.17
default node version 변경하기  (0) 2018.10.14
리액트네이티브 디바이스 정보 출력 react-native-device-info  (0) 2018.10.11
RCTCameraRoll 라이브러리 연결하기 (Xcode)  (0) 2018.10.11
블로그 이미지

클라인STR

,

default node version 변경하기

React & React Native 2018. 10. 14. 20:44

Default Node 버전을 변경해야되는경우 다음 명령어를 실행한다. react-native 실행시 node 버전을 default 버전을 따르는거 같아서 아래 명령을 수행하여 default 버전을 변경하였다.


nvm alias default 버전명



nvm 을 이용하여 필요한 npm 버전을 설치합니다.



nvm ls 명령어를 이용하면 default 버전이 8.3.0 인데  해당버전을 8.10.0 으로 변경해줍니다. 



출처 : https://eric.blog/2016/08/23/set-default-node-version-with-nvm/

'React & React Native ' 카테고리의 다른 글

FlexBox 레이아웃이란? (2)  (0) 2018.10.17
FlexBox 레이아웃이란? (1)  (0) 2018.10.14
리액트네이티브 디바이스 정보 출력 react-native-device-info  (0) 2018.10.11
RCTCameraRoll 라이브러리 연결하기 (Xcode)  (0) 2018.10.11
Unable to resolve module `./../../react-transform-hmr/lib/index.js`  (0) 2018.10.10
블로그 이미지

클라인STR

,

Spring Security 이해하기

개발이야기 2018. 10. 11. 22:40

1. Spring Security KeyWord

  • Authentication (인증) : 사용자가 누구인지 확인하는 과정
  • Authorization (권한) : 현재 사용자가 특정 대상 (URL, 기능 등)을 사용할 권한이 있는지 검사하는것
  • Principal (접근주체) : 보호된 대상에 접근하는 사용자

Spring Security 는 인증과 권한과정을 Spring Security 에서 제공하는 Filter들의 흐름에 따라 이루어 지도록한다.

2. Authentication 와 SecurityContext

  • Authentication 의 용도 
    • 현재 접근 주체 정보를 담는 목적
    • 인증 요청 할때, 요청정보를 담는 목적
  • SecurityContext 
    • Authentication 을 보관
    • 스프링 시큐리티는 현재 사용자에 대한 Authentication 객체를 구할 때 SecurityContext로 부터 구한다.

Authentication 주요 메서드

  • String getName() : 사용자의 이름
  • Object getCredential() : 증명 값 (비밀번호)
  • Object getPrincipal() : 인증 주체 정보
  • boolean isAuthenticated() : 인증되었는지 여부
  • Collection getAuthorities() : 현재 사용자가 가진 권한

3. SecurityContextHolder

  • SecurityContext를 보관 
    • 기본 쓰레드로컬에 SecurityContext를 보관

4. AuthenticationManager

  • AuthenticationManager 인증을 처리함
  • 인증에 성공하면 인증 정보를 담고 있는 Authentication 객체 리턴 한다 
    • 스프링 시큐리티는 리턴한 Authenticatoin 객체를 SecurityContext에 보관 및 인증 상태를 유지하기 위해 세션에 보관
  • 인증 실패시 AuthenticationException을 발생시킨다.


public interface AuthenticationManager {

  Authentication authenticate(Authentication authentication)

  throws AuthenticationException

}

5. SecurityInterceptor

  • 인가를 처리한다. 
    • 웹의 경우 FilterSecurityInterceptor 구현 사용
    • AccessDecisionManager에 권한 검사 위임
  • 사용자가 자원의 보안 설정 기준으로, 접근 권한이 없을 경우 익셉션이 발생




'개발이야기' 카테고리의 다른 글

EXTAPI DLL 배포하기  (0) 2018.10.18
Tobesoft Component Wizard를 이용한 EXTAPI DLL만들기  (0) 2018.10.18
Spring Security적용기 (1)  (0) 2018.08.02
IBATIS 동적 컬럼 만들기  (0) 2016.01.05
자바 ArrayList 분할하기  (0) 2015.12.09
블로그 이미지

클라인STR

,

리액트네이티브 디바이스 정보 출력 react-native-device-info

React & React Native 2018. 10. 11. 20:55

react-native-device-info ReactNative에서 디바이스에 정보를 출력하는 네이티브 라이브러리 이다. 


[Installation] 
npm install --save react-native-device-info


[Linking]

 react-native link react-native-device-info



react-native-device-info를 사용하여 디바이스 정보를 출력해보자 


import DeviceInfo from 'react-native-device-info';


_DeviceInfo() {
console.log("DeviceInfo.getApplicationName : "+DeviceInfo.getApplicationName());
console.log("DeviceInfo.getBrand : "+DeviceInfo.getBrand());
console.log("DeviceInfo.getBrand : "+DeviceInfo.getBrand());
console.log("DeviceInfo.getBuildNumber : "+DeviceInfo.getBuildNumber());
console.log("DeviceInfo.getDeviceCountry : "+ DeviceInfo.getDeviceCountry());
console.log("getDeviceLocale : "+DeviceInfo.getDeviceLocale());
}





더 자세한 내용은 https://github.com/rebeccahughes/react-native-device-info 참고하자

'React & React Native ' 카테고리의 다른 글

FlexBox 레이아웃이란? (1)  (0) 2018.10.14
default node version 변경하기  (0) 2018.10.14
RCTCameraRoll 라이브러리 연결하기 (Xcode)  (0) 2018.10.11
Unable to resolve module `./../../react-transform-hmr/lib/index.js`  (0) 2018.10.10
리액트 네이티브 안드로이드 개발환경 설정  (0) 2018.10.06
블로그 이미지

클라인STR

,

RCTCameraRoll 라이브러리 연결하기 (Xcode)

React & React Native 2018. 10. 11. 00:38

XCode에서 RCTCameraRoll 라이브러를 연결하는법을 알려주는 동영상링크이다. 



'React & React Native ' 카테고리의 다른 글

default node version 변경하기  (0) 2018.10.14
리액트네이티브 디바이스 정보 출력 react-native-device-info  (0) 2018.10.11
Unable to resolve module `./../../react-transform-hmr/lib/index.js`  (0) 2018.10.10
리액트 네이티브 안드로이드 개발환경 설정  (0) 2018.10.06
Unable to resolve module `@babel/runtime/helpers/interopRequireDefault`  (0) 2018.10.06
블로그 이미지

클라인STR

,

SQL 쿼리 잘짜는 방법

DataBase 2018. 10. 10. 22:18





우선 저도 비전공자 입니다.
개발자체를 늦게 시작한 편이구요

강정식 님의 말씀도 맞습니다만..
좀더 부연설명을 하자면

저도 잘 못합니다. 맨날 주변에 물어보곤 하지요...
그래도 그 막연한(?) 답답함에서는 다소 벗어 났다고 생각하기에 
어줍잖게 적어 봅니다.


우선 내가 원하는 최종 결과를 엑셀 등에 적어 놓으세요.
그리고 아래 순서대로 해봅시다.



1. 순서를 생각하자.
    우선 순서를 생각해야 합니다. 
    어떤 순서인고 하니.. 하나의 쿼리를 짜내기 위한 순서 말이죠.
    sql 은 집합적 언어라고 하지만 제가 느끼기엔 집합적(+ 절차적) 이라고 생각합니다.
    순차적으로 생각할수도 있어야 한다는거죠.
    볼까요? 
    편의상 내가 조회해 오려는 결과 데이터를 "결과" 라고 표현 하도록 하죠.
    1) 내가 보여주려는 결과는 어느 테이블에 있는지 생각해봅니다.
    2) 결과를 뽑기위해 하나의 테이블을 사용하지 않으므로 내가 원하는 결과를 가지고 있는 
    테이블들을 나열해 봅니다.
    3) 이제 나열된 테이블중 주테이블이 무엇인지 생각해 봅니다.
    4) 마지막으로 원하는 결과의 값들은 무었이 있는지 생각해 봅니다.
    만약 , 가공이 필요한 컬럼이라면 가공 방법은 제외하고 가공된 값만 생각합니다.



2. From 부터 풀어보자
이제 대략적인 순서를 생각 했으므로 쿼리를 만들어 가보도록 하죠

1) select 절은 SELECT * 딱 한줄이면 됩니다. 에러방지용 이죠.

2) FROM 부터 들어가 봅니다. 주테이블의 순서대로
MAIN_T(주테이블) , TABLE1, TABLE2 , TABLE3 , CODE 테이블이 있다고 쳤을때 
코드 테이블을 제외한 나머지만 적어 봅니다.
여기까지 완성된 SQL 은 
SELECT *
FROM MAIN_T A 
, TABLE1 B
, TABLE2 C
, TABLE3 D
이겠죠....

3) 이제 조건을 걸어봅니다.
JOIN 도 걸고 상수조건도 걸고 ... 상수라면 AND A.PK_COL = '23' 과 같이 텍스트가 빡! 
박혀 있는 조건 입니다. 
변수로 들어오는 조건도 걸어봅니다.

4) 근데 위 3) 의 작업을 하다보면 이제 테이블의 연결이 좀 애매하고..
생각하지 않으려 해도 SELECT 절을 생각하게 되고 그러죠 그러다 보면 
'음...이부분은 INLINE VIEW 로 해야 겠군'
'음...이건 이쪽에서 가져와서 SUBQUERY 로 IN 조건을 줘야 겠군...'
'음...이건 어쩌구...저건 어쩌구...' 이런 고민 하게 되죠....그럼 점심 시간입니다. ㅋㅋ

5) 밥먹고 왔으니 SELECT 를 고민할 시간이죠 
SELECT 에 표현될 결과는 어떤거였나요? 맨처음 엑셀등에 적어 두셨죠? 
내가 조인한 테이블들이 그 바로 그 결과를 표현 할 수 있나요? 
아니라면 그담은 기술적인 문제일 뿐입니다.
예를 들어 
가로를 세로로 ... 또는 세로를 가로로... 또는 구성비를 어쩌구 저쩌구 
계층구조가 어쩌구....소계는 이러쿵 총계는 저러쿵 
그룹핑은 이렇게.. 데이터가 없는 테이블도 있으니 이런건 아웃조인 ... 
다 기술적인 부분이죠...이런건 검색해서 물어물어 찾으면 찾아집니다.


대략 이런식이죠...
기술적인 부분은 밥 짓는것과 같아요.
문제는 
밥을 쌀로 만드는지 .... 밀가루로 만드는지
물을 부어야 하는지 우유를 부어야 하는지
소금간을 해야 하는지 말아야 하는지 ... 를 알아야 하는거죠 
기술은
'물을 손등까지 오게 붓는다' 를 아는것과 같아요
한번도 밥을 안지어 본사람은 모르는거죠.

하다보면 
밥을 쌀로 만든다는것 , 물을 부어야 한다는 것 , 소금간은 안한다는것 ... 
물은 손등까지 오게 붓는다.....등을 알게 되죠
이제 그러다 보면 
'아...밥은 쌀로만 하는게 아니군 ... 콩,보리,팥,...'
'어라..오곡밥은 소금간을 좀 해야 하는군...'
'오잉...물대신 우유를 넣어도 되는군..'
뭐 점점 이렇게 알아가는거죠 

뭐 힌트를 쓰니...튜닝을 어떻게 하니...
몇시간 짜리가 몇분에 나오니...이런것들은 다 잊으세요..
24시간이 걸려 한줄이 나와도 내가 원하는 결과를 만드는거에 집.중. 하세요.
지금은 그래도 되는 때입니다.

그리고
조급하게 생각하지 마세요.
뭐든지 단계가 있고 노력이 있어야 합니다.

다만..."sql문 잘짜는 방법없을까요???" 라는 
다소 황당하고 어의없는 (나중에 보시면..^^)
그 질문을 지금 이곳에 했었다는 것만 절대 잊지 마세요.

창피함이 실력을 만듭니다.


보니까 상당히 절차적인거 같죠? 
근데 왜 SQL은 집합적 사고를 가져야 한다...고 할까요?
아마도 저 각 순서 또는 순서 전체를 집합적으로 생각 하라는 뜻일꺼에요 ...
그러니 결국 저 순서도 집합의 순서? ㅋㅋㅋ 
뭔소린지....저도 뭐라고 딱 ! 정의 하기가 좀 ㅎㅎ

뭐 예전 생각도 나고 해서 주저리 주저리 글을 썼네요...ㅎㅎ

근데 이렇게 글쓰고 있는 저는 얼만큼 잘하느냐 궁금하시죠? 
제가 개인적으로 알고있는 오라클클럽 멤버들중 최하위 입니다. 

음...쓰고 보니...좀...^^ 
저것이 정답은 아닐꺼에요...정답 알려드릴 실력도 아니고..
그냥 저는 그렇다는 거니....참고 정도 하시면 되겠네요..


출처 : 오라클클럽 http://www.oracleclub.com/article/53260


'DataBase' 카테고리의 다른 글

MySQL SUM 함수시 NULL 처리 0으로  (0) 2018.10.26
평균값을 구할때 NULL 값  (0) 2018.10.24
오라클 문자열 합치기 LISTAGG  (0) 2015.12.17
소계와 합계 구하는 방법 (1)  (0) 2015.12.17
프로시져란 (PROCEDURE) ?  (0) 2015.12.16
블로그 이미지

클라인STR

,

공지사항

글 보관함

달력

«   2024/05   »
일 월 화 수 목 금 토
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

티스토리툴바