Til
-
20.09.07:: TIL (react-native webview)Study/TIL 2020. 9. 7. 18:17
github.com/react-native-community/react-native-webview/blob/master/docs/Getting-Started.md 오늘의 한 일 react-native webview 활용 새롭게 배운 것 WebView란?! -> 어플리케이션 화면상에 내가 띄우고 싶은 웹페이지를 어플리케이션 안에서 보여주는 프레임을 말한다. 즉, link로 연결하지 않고 바로 내 어플 안에서 페이지를 보여줄 수 있다. react -natived에서 사용할 수 있는 React-native webview 라이브러리가 있다. react-native webview -reborn 라이브러리도 있는데, 이 버전 라이브러리를 깔아서 사용했더니 계속해서 모듈 에러가 났다. 구글링해도 이와 같은 에러가 별..
-
20.08.22:: TILStudy/TIL 2020. 8. 22. 21:43
오늘의 한 일 React Native Udemy 강의 새롭게 배운 것 navigation에서 push와 navigate는 다르다! navigate는 이동하는 방향과 현재 페이지가 같은 경우 렌더링이 되지 않지만, push는 무조건 새로운 화면을 불러와 그 화면들이 stack이 된다. 즉, 같은 페이지에 있더라도 누를 경우, 화면이 stack되어서 뒤로가기를 눌러도 같은 페이지인 이전 화면이 렌더될것. FlatList -> 배열을 태그의 리스트로 바꾸는 역할을 함. -> 'data' 속성을 전달해 주어야 함. (우리가 태그로 생성할 데이터 배열) -> 'renderItem' 속성도 필요함. (각 item을 각각의 태그요소로 변환시키는 기능) -> 만약 웹 React를 사용하다 왔다면, 여러분은 'mappi..
-
20.08.19:: TILStudy/TIL 2020. 8. 19. 19:24
오늘의 한 일 React Native 첫 수업 수강 새롭게 배운 것 React Native란 expo 란 React native와 react의 비슷한 것과 다른 것들 궁금한 것 react native에서는 arrow function이 안되나? SafeAreaView는 app.js에서 한번만 사용하면 되는가. 기업협업 이번주 부터 기업협업에 나가고 있다. 외국인 코워커들과 함께 일하는 것도 재미있는 것 같다. react native를 사용해야해서 오늘 we code day 에서 리엑트 네이티브 수업을 처음 관희님께 들었는데, wow.. 우린 네이티브 전사라뉘ㅎㅎㅎ react native는 경력 많은 사람이 3년차 정도일거라한다. 그래서 스스로 해결해야하는 문제도 많고, 공식문서를 무조건 친구삼아 해야한다고..
-
20.08.11:: TILStudy/TIL 2020. 8. 11. 14:12
오늘의 한 일 superfluid 장바구니 애니메이션, 마이페이지 UI 구현 새롭게 배운 것 [], {} 빈 배열, 빈 객체의 Boolean 값은 true이다! 😵 2차 프로젝트를 하면서 아래와 비슷한 조건문을 작성하였다. const arr = []; arr ? "ture" : "false"; 내 생각으로는 arr가 false가 나와야하는데, 자꾸 true가 나오는 것이었다. 알고보니, 빈 배열, 빈 객체는 boolean 값이 true였다. true라는 것을 지금까지 몰랐다니... boolean 값이 false인 경우는 아래와 같다. 알고 있었지만 다시 한번 상기해보자. var bNoParam = new Boolean(); var bZero = new Boolean(0); var bNull = new B..
-
20.08.10::TILStudy/TIL 2020. 8. 10. 14:38
오늘의 한 일 superfluid 장바구니 기능 구현 보완해야할 부분 함수 호출과 함수 자체를 적는 코드에 대해 조금 헷갈리고 있는 것 같다. 함수선언 function square(number) { return number * number; } # 함수호출 square(1); # 함수실행 console.log(() => square(2)); // function console.log(square(2)); // 4 console.log(square); // function:square 콘솔에 "() => {}" 이런 형태로 작성한다면 콘솔 결과에는 "함수" 자체가 출력된다. 함수에 인자값을 넣어 결과를 호출하고 싶다면 "함수명(인자)"를 입력해야한다. 만약, 함수명만 입력한다면 "함수: 함수명" 과 같은 ..
-
20.08.07:: TILStudy/TIL 2020. 8. 7. 16:21
오늘의 한 일 superfluid 메인페이지 (react-scroll-rotate/ react-slick) 새롭게 배운 것 오늘 처음으로 hook을 이용해서 react-slick을 사용해보았다. 사용하면서 useState를 처음 이용해보니 신기했다. 그러나.. 신기함은 잠시.. arrow가 왜 안보이지...? 한참을 헤매고 보니 "background-size: contain;" 을 해야했다... ㅎㅎㅎ size를 개별로 또 지정해주어야 하는구나..!! 메인페이지에 스크롤에 따라 rotate 움직여야 하는 사진과 박스가 있었다. 동료와 한참을 검색해 보니 react-scroll-rotate라는 라이브러리가 있었다. 이걸 이용해보니 아주 부드럽게 스크롤에 따라 rotate를 해주었다. :) "throttle..
-
20.08.06:: TILStudy/TIL 2020. 8. 6. 11:52
오늘의 한 일 superfluid 메인페이지 (Parallax 활용) 새롭게 배운 것 white-space: normal; 연속 공백을 하나로 합침. 개행 문자도 다른 공백 문자와 동일하게 처리해준다. 한 줄이 너무 길어서 넘칠 경우 자동으로 줄을 바꾼다. white-space: nowrap; nowrap연속 공백을 하나로 합침. 줄 바꿈은 요소에서만 일어난다. (Mdn 출처) -> infinite text 를 만드느라고.. 애를 먹었다. text가 움직이게 하는건 animation으로 할 수 있겠는데, 이 text가 infinite로 움직이게 하는 것은 어떻게 해야할까? 계속 애를 먹던 중에 white-space를 발견했다. 그리고 이 것이 'key'가 되었다. "white-space: nowrap;"..
-
20.08.04:: TILStudy/TIL 2020. 8. 4. 19:45
오늘의 한 일 get superFuild 홈페이지 메인! UI 새롭게 배운 것 marquee tag 자동재생 정책 변경사항으로 인해 크롬에서는 자동재생이 되려면 무음인경우나 유저 인터렉션 이벤트 발생 시 이다. (그래서 나는 무음으로 속성을 변경함! video tag에 muted를 추가함) 위코드 getSuperFluid!! 2차 프로젝트. 내가 낸 아이디어가 당첨되었다. 흐흐 uiux가 아주 화려한 화장품 웹사이트. 웹사이트 어워드에서 상 받은 곳이다. 화장품 회사의 철학도, 사진 스타일도, 한땀한땀 장인정신이 깃든 웹사이트도 멋지다. 그러나 이걸 내가 하게 될 줄은 몰랐다. ㅎㅎ 사실은 좀 두려웠다. "과연 내가 할 수 있을까??" 우리 팀은 5명의 "여성"들로 뭉친 팀이다. 한글버전 팀명은 '환불원..