민희의 코딩일지

SKT FLY AI Challenger 4기 프로젝트 프론트엔드 개발하면서 앱 상에서 미술작품의 사진을 찍어 크롭한 뒤 찌그러진 사진을 평평하게 펴주어야 했다. 사용자가 미술작품의 사진을 찍고 모서리에 맞게 크롭해주면, 평평하게 펴주는 기능을 구현하고자 이와 관련된 React Native 라이브러리를 찾아보았다. 그 과정에서 react-native-document-scanner-plugin이라는 오픈 소스를 찾게 되었고, 이를 활용해본 내용을 이번 포스팅에서 정리해보고자 한다. react-native-document-scanner 라이브러리는 아이폰 유저들에게 친숙할 것이다. 그 이유가 아이폰 메모앱의 문서스캔과 동일한 기능을 수행하기 때문이다. 이 라이브러리는 말그대로 최적의 문서스캔을 위한 라이브러리..

#1. ios/Pods 에러 cd ios (Podfile이 있는 디렉토리) sudo arch -x86_64 gem install ffi arch -x86_64 pod install #2. react-native에서 활용할 수 있는 tailwind.css 라이브러리 nativewind, tailwind-rn, twrnc 크게 이 세종류인것같은데, 나는 twrnc로 진행하였다. https://www.npmjs.com/package/twrnc?activeTab=readme twrnc simple, expressive API for tailwindcss + react-native. Latest version: 3.6.7, last published: 18 days ago. Start using twrnc in ..

사진과 같이 확장자가 .zip.irx인 경우 압축해제가 안된다. 이 경우는 다운로드 도중 네트워크가 끊기거나 불안정해 다운로드가 정상적으로 완료되지 않은 경우이다. .zip.irx인 경우 아쉽게도 풀 수 있는 방법이 없고, 다시 네트워크가 안정적인 상태에서 데이터를 다운로드 받아야한다.

https://www.acmicpc.net/problem/2559 2559번: 수열 첫째 줄에는 두 개의 정수 N과 K가 한 개의 공백을 사이에 두고 순서대로 주어진다. 첫 번째 정수 N은 온도를 측정한 전체 날짜의 수이다. N은 2 이상 100,000 이하이다. 두 번째 정수 K는 합을 구하기 www.acmicpc.net 알고리즘 누적합 풀이 연속된 온도의 합이 최대가 되는 값: 구간합 prefix sum psum[i] = psum[i-1] + a[i]; 최대값을 구하라: 최솟값부터 최대값을 구하라 ( ret = max(ret, value); ) n 과 k 를 입력받은 후, 매일 측정한 온도를 배열 psum에 저장한다. psum[i]는 1부터 i까지의 온도의 누적합을 나타낸다. cin >> n >> k..

https://www.acmicpc.net/problem/1159 1159번: 농구 경기 상근이는 농구의 세계에서 점차 영향력을 넓혀가고 있다. 처음에 그는 농구 경기를 좋아하는 사람이었다. 농구에 대한 열정은 그를 막을 수 없었고, 결국 상근이는 농구장을 청소하는 일을 시작 www.acmicpc.net 알고리즘 구현, 문자열 풀이 (1) key의 맨 앞의 한 글자만 잘라 map 에 넣어준다. map의 key 중에 그 글자가 있다면 value+1 을 해주고, 없다면 초기값 1로 세팅해준다. for(int i=0; isecond > 4) { cout first; isSelect=true; } } if(isSelect==false) { cout > N; for (int i=0; i> player; playe..

https://github.com/GirlsInICT2023-Winner/smart-outdoor-activity-alerts 길다면 길고, 짧다면 짧은 에릭슨엘지 주최 Girls In ICT 2023이 드디어 끝났다! 좋은 추억이었기에 후기로 남겨보려한다. Girls In ICT를 짧게 소개하자면 ICT 산업에서의 경력 개발을 꿈꾸는 이공계 여대생을 대상으로 하는 해커톤이다. Best Awards 3팀안에 든다면 상금과 에릭슨엘지에서의 인턴기회를 얻게 된다. 2023년의 주제는 '기후 변화에 적응하기 위한 커넥티드 서비스 아이디어 제안'이다. 참가 신청을 할 때 아이디어 제안서를 제출하고, 본선에 간 5팀이 라즈베리파이 데모키트를 받아 실제 커넥티드 서비스를 구현하는 것이다. 1. 참가신청 먼저 본 해..

1- Next.js 의 장점 React의 SSR(Server Side Rendering)을 쉽게 구현할 수 있게 도와주는 프레임워크이다. (*React는 라이브러리이다.) React로 개발할 때 SPA를 이용하여 CSR(Client Side Rendering)을 하기 때문에 좋은 점도 있지만, 검색엔진 최적화 부분에 취약하다. (SEO) CSR를 하면 첫페이지에서 빈 html을 가져와서 JS 파일을 해석하여 화면을 구성하기 때문에 포털 검색에 거의 노출될 일이 없다. 그러나, Next.js에서는 Pre-Rendering을 통해 페이지를 미리 렌더링하며 완성된 html을 가져오기때문에 사용자와 검색엔진 크롤러에게 바로 렌더링된 페이지를 전달할 수 있다. 원래 React의 방식 (4단계에 화면보임) SSR ..

1- useContext란? React 에서 데이터의 흐름은 위 → 아래 (부모 → 자식)로 Props 를 통해 전달한다. Props 를 사용하여 데이터를 전달할 때는 부모 컴포넌트가 자식 컴포넌트 태그에 일일이 Props 를 넣어 단계별로 전달해줘야 한다. (Prop Drilling: 가장 아랫단에 있는 컴포넌트만 데이터가 필요해도 전달하는 과정에서 데이터는 중간 컴포넌트를 거쳐야 한다. Main 컴포넌트는 데이터가 필요없는데도 Profile 컴포넌트에 데이터를 전달하기 위해서 데이터를 Props 로 받은 뒤 다시 Props 로 넘겨주어야 한다.) 부모 컴포넌트 (App) 자식 컴포넌트 (Header) 앱 내부에서 수많은 컴포넌트들이 공통적으로 필요한 전역적인 데이터가 있을 때 Props 를 이용해서 ..