전체 글 50

[React Native] react-native-shadow-2로 shadow 효과 주기

드디어 react native로 퍼블리싱을 하는데.. 세팅부터 뭐하나 쉬운게 없다. 그중에서 shadow효과는 ios와 android에서 조정할 수 있는 속성 종류가 다르다. * ios -shadowColor -shadowOffset -shadowOpacity -shadowRadius * android -elevation android야..? 이게 다냐고.. https://www.npmjs.com/package/react-native-shadow-2 그래서 react-native-shadow-2를 사용해서 두 기종의 핸드폰에서 균일한 그림자를 만들 수 있다. npm 혹은 yarn을 이용해서 설치하고 컴포넌트로 그림자를 주고 싶은 요소를 감싸서 만든다. *주의할 점: borderRadius가 안먹는다?? ..

JavaScript/React 2024.02.26

[전시회 기록] 후지시로 세이지 - 오사카 파노라마展

처음으로 가본 세종문화회관 많이 들어는 본 것 같은데 정말 처음 가본 것 같은 낯섦이 느껴졌다. 길을 많이 헤맸다. 솔직히 실제로 보기 전엔 별 기대를 안했다. 실물이 분명 훨씬 나을거란건 알았지만 뭔가 그림자를 이용한 그림이라니.. 살짝 유치할 것 같기도 하고.. 너무 애들 보는 전시회를 간거 아닌가 싶었다. 근데 첫 전시물부터 그런 생각은 싹 사라지고 유심히 들여다보게 되는 매력이 있다는 느낌을 받았다. 컴퓨터로라면 간단히 쓱쓱 그려나갈 수 있는 흐림효과나 빛의 밝기 조절을 다 수작업으로 대부분 기름 종이를 이용해 투과시켜 표현해낸다는 것이 대단하게 느껴졌다. 가까이서 보면 칼로 잘라내서 투박한듯한 테두리를 느낄 수 있는데 하나의 작품을 봤을 땐 그런 거친 외곽선이 전혀 문제 되지 않고 하나의 완성된..

어느날/2024 2024.02.13

[CSS] CSS방법론 - BEM (Block Element Modifier)

block__element--modifier 구조에 맞춰 class를 쓰는 방식. 최대한 단일 클래스로 선택자를 불러와 특이성을 낮춰 !important를 쓰는 일을 줄인다. 1.구조 1).Block -독립적인 컴포넌트를 의미 -다른 블록으로 들어갈 수도 있지만 독립적으로도 쓰임 -단어를 조합 시 하이픈으로 연결 -목적에 따라 이름을 정해줄 것 -환경에 따라 영향을 받으면 안됨 2).Element -의존적인 구성요소를 의미 -블록이 있어야 의미를 가지기 때문에 분리해 재사용할 수 없음 -목적에 따라 이름을 정해줄 것 -단어끼리 조합은 하이픈으로 함 -필수 작성 아님 3).Modifier -Block이나 Element의 속성을 의미 (모양, 동작, 상태) -boolean이나 key-value타입으로 작성..

CSS 2023.12.25

[독서 기록] 아몬드, 손원평 저

오늘은 독서 모임 사람들과 여러 가지 깊은 대화를 나눴다. 223쪽. 나는 알고 있다. 곤이가 착한 아이라는 걸. 하지만 구체적으로 곤이에 대해 말하라면 그 애가 나를 때리고 아프게 했다는 것, 나비를 찢어 놓았다는 것, 선생에게 패악질을 부리고 아이들에게 물건을 집어던졌다는 것밖에 말할 게 없다. 언어라는 건 그랬다. 이수와 곤이가 같은 사람이란걸 증명하는 것만큼이나 어려운 거다. 건이는 윤재가 말한 것처럼 '착한' 아이라고 볼 수 있을까? 언어적 한계를 느끼면서도 마음으로 사람을 이해한 윤재의 태도를 느낄 수 있는 대목에서 내가 느낀 궁금증을 사람들에게 질문하였다. 건이는 행동이 거칠지만 시간이 갈수록 서로의 다른 점을 느껴가며 자기 자신을 똑바르게 바라보는 윤재에게 친구가 되고자 서툴게 다가갔다. ..

어느날/2023 2023.06.25

[영상 기록] 자신에게 필요한 기록을 하는 방법

학생 때 필기를 잘한다는 말을 종종 들었는데 단순히 필기를 하는 행위를 잘 한다는 것과 진짜 필기를 잘하는 것은 다른 것 같다. 그래서 내가 이렇게 지금 필기를 하고 있어도 별 도움이 안된다고 생각한 시기도 있었는데 오늘 우연히 한 영상을 봄으로써 다시 제대로 필기를 해보고 싶다는 마음이 들었다. * 기록하는 습관이 주는 이점 - 경험과 노하우가 쌓여가는 누적된 삶을 살아갈 수 있다. - 자기 자신을 보는 시력이 더 좋아진다. * 필기 하는 방법 1). 핵심만 매우 압축해서 글을 쓴다. : 키워드, 중심 내용을 적기 2). 내용을 머릿속에 박히도록 메모한다. : 이걸 기억 하지 못해서 내용을 다 적어둔다는 마음을 가지면 안됨. 3). 흐름을 쪼개고 하나의 내용을 접하면 메모를 한다. 4). 정 기억 안나..

어느날/2023 2023.06.25

23.05.29 월_쉬는 월요일 최고~~~~

사람은 기계가 아니다. 고로 삘 받는 날이 있으면 그땐 밤늦게 아니라 아침에 씻게 되더라도 바로 자리에 앉아 밤 늦게 까지 작업도 해보고 공부가 잘 안되는 날엔 두 손 두 발 다 놓고 있다가 에너지가 다시 모이면 출발하면 된다. 오늘은 왜 망쳤지? 왤케 나는 느려터졌지? 이런 생각 하나도 도움이 안된다. 남이 먼저 공부하고 있어도 내가 하기 싫으면 하지 말고 내가 공부하고 싶으면 공부한다. 나에게 꼭 필요한 유도리 있는 자세인듯.. 와 근데 나는 빗소리를 생각보다 되게 좋아하는데 맑고 밝은 날이 역시 눈으로 보기에는 매우 최고이다. 너무 햇빛 좋고 예쁘고~~~~

어느날/2023 2023.05.29

mac에서 ssh key 발급 받아 gitlab 프로젝트 clone하기

회사 플젝을 클론하고 싶은데 개인 pc로 접속하려면 ssh key를 발급 받을 필요가 있다. ssh key가 없으면 접속이 안됨. ㄱ= 진짜 엄청 많은 곳에서 방법들을 짜깁기해서 성공했는데 내가 막혀서 헤맨 부분들을 정리해본다. // 개요 1. ssh key 받기 2. ssh key 등록 3. config 값 변경 4. git clone 받기 1.ssh key 받기 // ssh-keygen -t rsa -C "여기엔 이메일 입력하자"; ssh-keygen -t rsa -C "asdf@gmail.com"; 엔터를 치면 키를 저장하는 경로가 뜨며 ssh키 파일명을 설정할 수 있는데 계정이 하나만 ssh key 하나만 필요할 경우 기본값 id_rsa로 파일이 저장되도록 그냥 엔터치면 된다. // Enter f..

Web Publisher 2023.05.05

[JavaScript] 백틱(``)으로 값을 작성하는 것에 대하여

백틱(``)을 배웠다..! 근데 쓰임새가 조금 어려운듯 하다. 편하라고 쓰는데 말이다. 오히려 그냥 문자열끼리, 변수끼리 단일 따옴표로 감싸고 +로 이어주기만 하면 되는 방식이 단순하게 생각해도 되서 더 편한 것 같기도 하다. 하지만 백틱을 쓰는 것이 번거러워도 꽤 코드를 단순화시킬 수 있을 때가 있는데 그것은 바로 삼항연산자를 쓸 때이다. 삼항 연산자는 어떠한 조건의 값이 true냐 false냐에 따라 원하는 값을 달리 작성하고자 할 때 요긴하게 쓰인다. 우선 백틱은 문자열과 변수를 함께 사용하고 싶을 때 변수이름은 ${}안에 넣어주고 그렇게 감싸준 변수명과 문자열을 다시 한 번 감싸줄 때 사용된다. 그리고 값을 작은 따옴표에 써줘야 할 때 백틱을 사용해서 써주고 싶다면 어떻게 해야 하나? 그것은 이렇..

JavaScript 2021.06.04

[JavaScript] 새로운 요소를 생성하고 텍스트 삽입하기

pick on.. 픽온.. 급 피곤하다. 사용자가 읽을 정보는 가급적 html안에 작성하는 것이 좋다고 생각하긴 하지만 자바스크립트를 연습할겸 새로운 요소를 만드는 법을 연습하였다. innerHTML로 생성하는 방법이 있고 createElement로 만드는 방법 두 가지 이상의 방법이 있다. (성능 비교해보면 innerHTML이 더 좋은 것 같다. 그러나 뭔가 표준은 createElement인듯..) createElement로 요소를 생성하는 방법이 좀 더 복잡하니까 먼저 알아보도록 하자. 일단 어디에 새로운 요소를 만들 것인지를 생각해야 한다. ┌ 이미 생성되어있는 요소 안에 넣을 것이라면 선택자로 불러와야하고 └ 아무것도 없는 body에 만들 것이라면 document를 불러와준다. 그 뒤에 .crea..

JavaScript 2021.06.03

[JavaScript] 예외 발생시키기 - try / throw / catch / finally

1. try / catch / finally var value; try{ value = ball; //1. ball이란 변수가 선언되어 있지 않으므로 에러가 발생됨. } catch(error) //2. catch문을 실행한다. error라고 꼭 고정해서 쓰지 않아도 된다. console.log("catch 실행"); }; //catch 실행 var sports; try{ sports = ball; } catch(error) { log("catch 실행"); } finally { log("finally 실행"); // try또는 catch문을 실행한 후 finally블록을 실행시킴. }; - try문에서 예외 발생을 인식 (주로 에러 상황인듯) : try문에 작성한 코드에 에러가 발생해도 프로그램은 죽지 ..

JavaScript 2021.03.24