위코드
-
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.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.04:: TILStudy/TIL 2020. 8. 4. 19:45
오늘의 한 일 get superFuild 홈페이지 메인! UI 새롭게 배운 것 marquee tag 자동재생 정책 변경사항으로 인해 크롬에서는 자동재생이 되려면 무음인경우나 유저 인터렉션 이벤트 발생 시 이다. (그래서 나는 무음으로 속성을 변경함! video tag에 muted를 추가함) 위코드 getSuperFluid!! 2차 프로젝트. 내가 낸 아이디어가 당첨되었다. 흐흐 uiux가 아주 화려한 화장품 웹사이트. 웹사이트 어워드에서 상 받은 곳이다. 화장품 회사의 철학도, 사진 스타일도, 한땀한땀 장인정신이 깃든 웹사이트도 멋지다. 그러나 이걸 내가 하게 될 줄은 몰랐다. ㅎㅎ 사실은 좀 두려웠다. "과연 내가 할 수 있을까??" 우리 팀은 5명의 "여성"들로 뭉친 팀이다. 한글버전 팀명은 '환불원..
-
20.07.24:: TILStudy/TIL 2020. 7. 24. 11:50
오늘의 한 일 컨버스 홈페이지 클론 프로젝트 -> (제품 리스트 fetch함수 이용하려 백엔드와 연동 후 랜더링 완료!) -> (가격 순으로 sort 완료!) 새롭게 배운 것 {this.state.itemDatas && (} -> 좌항이 true 일 때 우항이 실행됨. state 끌어올리기!!! (연어가 헤엄치듯이 두 컴포넌트의 가장 단거리 맞접히는 컴포넌트에서 state를 통해 서로 데이터를 주고 받을 수 있다!!) 참조 : https://ko.reactjs.org/docs/lifting-state-up.html State 끌어올리기 – React A JavaScript library for building user interfaces ko.reactjs.org 깃은 대소문자를 구분하지 못한다. 그래서..
-
20.07.13:: TILStudy/TIL 2020. 7. 14. 12:00
오늘의 한 일 react로 인스타그램 구현 중 Feed 컴포넌트를 map메소드를 호출하여 구현함. Feed 컴포넌트에서 댓글기능을 따로 컴포넌트화해서 가져옴. 알고리즘 새롭게 배운 것 map 메소드 활용을 처음으로 적용해봄. component를 잘 활용하면 각 피드에 대한 함수적용이 쉽다. (예. 각 피드에서 댓글 기능구현) 위 코드 라이프 '경주마 처럼 달리기 보다는 내가 짠 함수를 다시 돌아보며 가자' 위코드에서 알고리즘 풀기, 과제 구현하기, 새로운 리엑트 기술들 배우기.. 이 모든것들을 따라가려하고, 옆 동료들과 발맞추어 가려다 보니 경주마처럼 달리고 있는 내 모습을 발견하게 된다. 내가 짠 함수를 정말 내 것으로 다시 만들기 위해서는 다시 돌아보고 복기하는 습관이 필요한 것 같다. 매일매일 TI..
-
20.07.06:: TILStudy/TIL 2020. 7. 7. 11:25
오늘의 한 일 자료구조에 대해 공부 자료구조[배열] 공부 react 공식문서 [이벤트 핸들링] 공부 새롭게 배운 것 자료구조는 데이터에 편리하게 접근하고 조작하기 위해 데이터를 저장하거나 조직하는 방법으로써 각 자료구조의 본질과 콘셉트를 이해하고 상황에 맞는 적절한 자료구조를 선택하는 것이 중요하다. 자료구조 중 '배열'의 가장 큰 특징은 순차적으로 데이터를 저장한다는 점이다. 그래서 배열은 주로 순서가 상관 없더라도 서로 연결된 데이터들을 저장할때 일반적으로 사용된다. 배열의 단점은 데이터를 중간에 추가하거나 삭제해야할 경우, 배열을 전부 이동시켜야 하기 때문에 다른 자료구조에 비해 메모리를 많이 차지한다는 점이다. 고로, 데이터 변경이나 이동이 많을 경우에는 적절치않다. 위 코드 라이프 html, c..