분류 전체보기

📝 꾸준함이 무기/Flutter

Error : Image data CORS 오류

오류 로그 ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════ The following ImageCodecException was thrown resolving an image codec: Failed to load network image. Image URL: https://cloudfront-ap-northeast-1.images.arcpublishing.com/chosun/U4IIQNIIYFLA3JC7EYMNJMOCIA.JPG Trying to load an image from another domain? Find answers at: https://flutter.dev/docs/development/pla..

🙋‍♀️ 회고/오늘의 기록

~ 2023. 2. 13

굉장히 오랜만에 기록을 남기게 되었습니다. 벌써 2023년 해돋이를 본 게 엊그제 같은데, 2월이라니 당황스럽습니다. 오랫동안 기록을 남기지 않았기에 그만큼의 일들이 한껏 축적되어있습니다. 1. 정든 나의 첫 회사, 논에고랩 안녕 1월 31일을 마지막으로 그만두게 되었습니다. 1년 이상을 머물고 있다보니 정이 많이 들어서, 처음 퇴사를 결정했을 때 글썽글성했는데, 오히려 퇴사 당일에는 쓸쓸함과 일종의 해탈을 느꼈던 것 같습니다. 사내 스터디도 퇴사 후에도 계속 하기로 했으니 매주마다 팀원들 얼굴을 볼 것이고, 진저 일을 도와주게 되어서 어찌보면 퇴사를 했는데, 퇴사를 하지 않은 그런 상태가 되어버렸네요. 2. 곧, 서울 올라갑니다 저번주에 집 계약을 했습니다. 드디어 나의 고향, 안식처 안동을 떠나 서울..

📝 꾸준함이 무기/SICP

SICP:JS Edition 1.1 프로그래밍의 기본 요소

1.1 프로그래밍의 기본 요소 프로그래밍의 기본 요소 원시 표현식 : 언어와 관련한 가장 단순한 개체(entity) 조합 수단 : 단순한 요소들로부터 복합적인 요소를 만듦 추상화 수단 : 복합적인 요소들에 이름을 붙여서 하나의 단위로 다룸 모든 강력한 프로그래밍 언어는 반드시 원시 데이터와 원시 함수를 서술하는 기능이 있어야 하고, 그런 함수들과 데이터를 조합하고 추상화하는 수단들도 제공해야 한다. 표현식 표현식 문장은 표현식(expression)과 세미콜론(;)으로 구성된다. 표현식은 하나 이상의 원시 표현식(primitive expression)으로 구성되는데, 여러 원시 표현식 중 하나로 수(number)가 있다. 수를 나타내는 표현식들은 연산자(+나 *같은)로 조합할 수 있다. 그 결과는 연산자들..

📝 꾸준함이 무기/SICP

자바스크립트로 배우는 SICP

최근 SICP( Structure and Interpretation on Computer Programs) : JavaScript Edition 책을 가지고 스터디를 진행하고 있다. 물론 최신 트렌드와는 맞지 않는다는 이유로 MIT에서는 교과과정에서 배제되었지만 이 책이 프로그래밍을 하는데 도움이 되지 않는다고는 말할 수 없을 것이다. 최근 트렌드는 다른 사람들이 써놓은 라이브러리를 적재적소에 잘 사용해서 빠르게 만들어 출시하는 것이지만, SICP의 커리큘럼을 따라가면 다른 사람들이 라이브러리를 만든 것처럼 나 스스로가 튼튼한 라이브러리 또는 앱을 만들 수 있다고 생각한다. 어떤 사람이 SICP에 대한 후기를 남긴 것을 보았는데, "폴리글랏, 그리고 메타 프로그래밍을 할 수 있도록 훈련시키는 책" 이라고..

📝 꾸준함이 무기/React

Next.js 아닌 React SSR에 대하여

왜 사람들을 Next.js를 사용하는 걸까? google에 입력해보면 대부분 SSR하려고 쓴다라는 포스팅 뿐이다. (물론 이 외 이점들이 있다.) 애초에 Next.js 는 React 프레임워크인데 그냥 Next.js 없이 React만으로 SSR을 하면 되는게 아닐까? 오히려 Next.js를 쓰는게 추후 기술적 부채가 될수도 있지 않을까? 라는 생각에 React만으로 SSR을 하는 법을 파헤쳐본다. SSR SSR(Server Side Rendering)은 서버에서 사용자에게 보여줄 페이지를 모두 구성하여 사용자에게 페이지를 보여주는 방식이다. 서버를 이용해서 페이지를 구성하기 때문에 클라이언트에서 구성하는 CSR(Client Side Rendering)보다 페이지를 구성하는 속도는 늦어지지만 전체적으로 사..

📝 꾸준함이 무기/Information

하루 5분 UX 리뷰

하루 5분 UX UX는 직독하면 User eXperience 즉, 사용자 경험이다. 목표는 사용자가 쓰기 편한 데에 있다. 흔히들 UI/UX를 묶어서 말하는데, 이 둘의 공통점은 User이다. 사용자에 포커스가 맞춰져 있다. 사용자가 보기에 심미적으로 우수하고, 사용성이 좋은 앱은 매출 증가에도 영향을 끼칠 수 있다. 나는 디자이너는 아니지만, 프론트엔드 개발자로서 서로 협업을 하기 위해 이에 대한 기본적인 지식이 필요함을 알고있다. 그저 눈에 보여지는 디자인을 화면에 옮기는 것이 아니라 디자인 안에 숨겨진 UX를 이해해야 온전히 디자인을 적용했다라고 얘기할 수 있다. 모두에게 100% 맞는 UX는 없다. 나에게는 이 앱이 편하나 다른 사람에게는 편하지 않을 수 있다. 그럼에도 불구하고 공통적으로 드러나..

💻 코드공방

재사용 가능한 react-hook-form 컴포넌트 만들기 (+ typescript, tailwind)

react-hook-form을 재사용 가능하게 만들고 싶어서, 이리저리 레퍼런스를 찾아보았지만 내 입맛에 맞는 것은 없었다. 그래서 수많은 삽질 후, 결국 만들어냈다. react-hook-form.. 너무 힘들었다 증말 react-hook-form의 기본 사용법 기존, react-hook-form에 있는 docs를 참고해보면 아래와 같이 쓸수도 있을 것이다. 하지만, 사용자입력값을 받아와야하는 폼들은 사용해야될 곳이 굉장히 많다. 매번 사용할 때마다 아래와 같이 입력하는 것은 참 번거롭다. import { useForm } from "react-hook-form"; export default function App() { const { register, handleSubmit, formState: { e..

📝 꾸준함이 무기/Flutter

notification.metrics.axis == widget.axis : is not true

'notification.metrics.axis == widget.axis': is not true. Listview 위젯의 physics를 통해 스크롤 방식을 제어할 수 있는데, 아래처럼 ScrollPhysics가 적용되어있는 Listview 하위에 수평적으로 스크롤이 가능한 ListView를 두려고 했다. 이 때, 하위 ListView에서 수평스크롤이 먹히지 않고, 컨텐츠 너비가 흘러넘쳤다. 이러한 경우 아래처럼 하위 ListView에 BouncingScrollPhysics() 를 적용하여 해결할 수 있었다. 보통 bouncingScrollPhysics을 적용하면 목록보다 더 많이 스크롤을 했을때, 바운스되면서 다시 목록이 있는 지점으로 돌아오는 기능을 한다. 근데 왜 위와 같은 상황에서 Bounci..

📝 꾸준함이 무기/React

tailwind 폰트적용

로컬에 폰트파일을 두고 사용하는 경우로 글을 작성합니다. 제가 예시로 사용할 폰트는 Tenada 입니다. 다운로드는 https://blog.naver.com/tenada/222849825644 에서 할 수 있습니다. font-face 적용. css파일에 font-face를 적용시켜주면 되는데, 저는 tailwind 지시문이 있는 css파일에 넣어주었습니다. 어느 css파일이든 상관은 없으나 css파일을 import해서 넣어주는 부분이 앱 구조상 윗단에 있으면 상관 없습니다. 이미 이렇게 넣어줌으로써, className에 tailwind 식으로 넣을 수 있습니다. 안녕하세요 여기서, 나는 theme으로 정의하고 싶다면 아래의 방법을 따라합니다. tailwind.config.js에서 theme을 정의합니다...

📝 꾸준함이 무기/Flutter

flutter 캐시 삭제

설치한 플러터 패키지 내용을 직접 수정할 일이 있었다. 패키지를 삭제 후, 다시 설치해도 수정했던 이력이 그대로 남아서 원래 패키지 내용으로 돌아갈 수 없었다. 이때 패키지가 저장되어있는 곳이 .pub-cache 폴더인 것을 보고 캐시를 삭제했더니 패키지 원본을 받아올 수 있었다. pub의 종속성(=패키지) 중 일부는 pub 캐시에 다운로드된다. (출처 : https://fartlang.org/tools/pub/installing.html) 만약 패키지를 수정했는데 원본으로 돌리고 싶다거나 패키지 원본이 손상되면 아래의 커맨드를 입력해보면 좋겠다. $ flutter pub cache repair

📝 꾸준함이 무기/Flutter

IOS 실기기에서 테스트하기 (맥북, 아이패드, VSCode, Flutter App)

맥북을 사용하고 있고, 에디터는 VSCode를 씁니다. 테스팅할 앱은 Flutter로 만든 앱입니다. 아이패드를 테스팅기기로 삼은 경우라 아이폰과는 조금 다를 수도 있습니다. 1. 버전 업데이트 맥북, 아이패드, X-code를 최신으로 모두 업데이트 시켜줍니다. (서로 버전이 맞지않아 되지 않는 경우도 있다 합니다.) 2. 맥북과 아이패드를 USB로 연결시켜줍니다. 이때 아이패드에서 권한허가에 대한 대화상자가 뜨는데 허가를 눌러줍니다. 3. Xcode 셋팅 테스팅할 앱에서 커맨드를 입력합니다. open ios/Runner.xcworkspace 그러면 아래와 같은 창을 볼 수 있습니다. 순서대로 따라해봅시다. 좌측편 Runner 메뉴를 누릅니다. Signing & Capabilities 탭을 누릅니다. 펼..

📝 꾸준함이 무기/Information

[Error] flutter_blue:generateDebugProto

flutter_blue 패키지를 다운받고, 앱을 구동시키는데, 오류가 발생했다. FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':flutter_blue:generateDebugProto'. > Could not resolve all files for configuration ':flutter_blue:protobufToolsLocator_protoc'. > Could not find protoc-3.11.4-osx-aarch_64.exe (com.google.protobuf:protoc:3.11.4). Searched in the following locations: https://repo.mav..

Cheri
'분류 전체보기' 카테고리의 글 목록