[Flutter] SizedBox를 Padding 대신 사용하지 말아야 하는 이유
Develop/Flutter2025. 2. 8. 00:34[Flutter] SizedBox를 Padding 대신 사용하지 말아야 하는 이유

개요 Flutter로 앱 개발을 하다보면 `Padding`과 `SizedBox`를 굉장히 많이 사용하게 된다. `Padding`은 이름 그대로 위젯에게 padding, 즉 간격을 주는 위젯이기에 많이 사용되고, `SizedBox`는 `Padding`과 같은 기능을 함과 동시에 위젯의 위치를 잡는다거나 빈 공간에 위젯을 미리 할당하는 식으로 여러 방식으로 활용이 가능하여 많이 사용된다.  그런데 `SizedBox`가 아무리 `Padding`과 똑같은 기능을 한다고 해도, 코드를 작성하는 부분이나 성능적인 부분에서 차이가 발생하게 된다. 그렇다면 둘 중에 어떤 부분이 더 좋다고 할 수 있을까? 물론 어느 하나가 무조건 더 좋다고는 말 할 수 없지만, `SizedBox`를 `Padding` 대신 사용하는 것을..

[Develop] svg vs png : 뭐가 더 좋을까?
Develop/Develop2025. 2. 7. 22:29[Develop] svg vs png : 뭐가 더 좋을까?

개요 Flutter뿐만 아니라 프런트엔드 개발을 하다 보면 앱 내부에 이미지를 넣어야 할 때가 있다. 이런 상황에서 일반적으로 두 가지의 포맷을 사용하곤 하는데, 그 두 포맷이 svg와 png다. (jpeg는 투명도가 없기에 사용하지 않는다.) figma를 보고 작업을 하다보면 디자이너가 아이콘들을 svg 포맷으로 주곤 한다. 평소에는 별생각 없이 svg 파일을 받아 사용했는데 문득 의문이 들었다. 'svg를 주로 사용하는 이유가 뭐지?', 'png도 같은 역할을 하는데, 둘의 명확한 차이에 대해 나는 알고 있었나?'. 그래서 개발에서 둘의 차이에 대해 조금 더 깊게 알아보기로 했다. 우선은 간단하게 각각의 특징에 대해 알아보고 성능 상의 차이에 대해 알아보자. 각각의 특징SVG 포맷 SVG는 Sc..

백준 1402번 아무래도 이 문제는 A번 난이도인 것 같다 - C++
Algorithm/PS2025. 2. 2. 02:33백준 1402번 아무래도 이 문제는 A번 난이도인 것 같다 - C++

문제어떤 정수 A가 있으면 그 숫자를 A = a1 * a2 * a3 * a4 ... * an으로 했을 때 A' = a1 + a2 + a3 ... + an이 성립하면 "A는 A'으로 변할 수 있다"라고 한다. (ai는 정수) 만약 A'이 A''으로 변할 수 있으면 "A는 A''으로 변할 수 있다"라고 한다.이때 A와 B가 주어지면 A는 B로 변할 수 있는지 판별하시오. 입력첫째 줄에는 테스트 케이스의 개수 T(1 ≤ T ≤ 100)이 주어진다. 테스트 케이스마다 두 정수 A, B(-2^31 ≤ A, B ≤ 2^31-1)가 주어진다. 출력각각의 테스트 케이스마다 한 줄에 변할 수 있으면 yes, 아니면 no를 출력한다. 문제 링크1402번: 아무래도이문제는A번난이도인것같다  풀이 처음에는 정말 아무 생각없이..

[Flutter][Issue] Flutter 카카오 로그인 릴리즈 키
Develop/Flutter2024. 12. 29. 16:10[Flutter][Issue] Flutter 카카오 로그인 릴리즈 키

문제 상황 서비스를 배포하고나서 안드로이드 기기에서 카카오 로그인이 안된다는 버그 리포트를 받았다. 안드로이드 기기에서만 안된다는 것을 제보받고 패키지의 문제인가 생각을 했다. 그런데 그런 이슈가 있다는 걸 듣지도 못했고, 디버그 모드에서 잘 동작하는 것을 확인하고나서 카카오에 등록한게 문제가 생겼다는 것을 인지했다.  원인과 해결원인 Android 플랫폼 등록을 할 때 키 해시를 등록하는 부분이 있다. 테스트를 할 때에는 디버그 키 해시를 받아서 등록을 해놓는데, 구글 플레이에 앱이 등록되고 나서는 릴리즈 키 해시를 등록해줘야한다. ▼  조금 더 정확히 말하자면, 디버그 앱은 안드로이드 스튜디오에서 자동으로 서명해준 키 스토어로 서명되어있다. 그에 반해 구글 플레이에 등록되는 앱은 개발자가 직접 생성한..

[JS] CommonJS와 ES모듈
Develop/React2024. 12. 13. 23:55[JS] CommonJS와 ES모듈

개요프론트엔드 개발을 막 접했을 시점에 VScode에서 이런 경고 문구를 보게 되었다. ▼ JS에 대해 잘 모르기도 했고, 애초에 ES 모듈이 뭔지 그리고 CommonJS 모듈이 뭔지도 몰랐기도 하고 잘 동작하기에 그냥 넘어갔었다. 그런데 이런 사소한 것들을 그냥 지나치면 나중에 큰 문제가 될 수 있을 거 같아 한 번 찾아보면서 정리를 해봤다. CommonJSCommonJS란 CommonJS는 Node.js의 초기 모듈 시스템으로, 모듈을 로드하고 관리하기 위해 설계된 시스템이다. 주로 서버사이드에서 사용이 된다. 상당히 레거시한 느낌이 강하지만 Node.js 생태계 전반에서 사용되고 있으며 많은 라이브러리에서 지원이 된다. (개요에서 필자가 뭔지도 모르고 썼음에도 동작할 수 있었던 이유다.) Commo..

[Flutter][Widget][Issue] TabBar 왼쪽에 공간이 생기는 현상
Develop/Flutter2024. 12. 11. 22:57[Flutter][Widget][Issue] TabBar 왼쪽에 공간이 생기는 현상

문제 상황 TabBar를 이용하여 한 페이지에 여러 개의 뷰를 보여주는 UI는 거의 대부분의 앱에서 사용될 정도로 흔하다. 일반적으로는 고정된 개수의 TabBar를 사용하기에 스크롤 할 일이 없는데, 때로는 여러 개의 TabBar를 두어 스크롤이 들어가기도 한다. 그런데 스크롤을 넣기 위해 `isScrollable`을 `true`로 바꾸면 사진과 같이 왼쪽에 의문의 Padding이 들어가게 된다. ▼ 왜 이 빈 공간이 생기는 것이고, 어떻게 하면 제거할 수 있을까?  원인과 해결원인 원인은 `TabAlignment`에 있다. 사진의 설명에 나와있듯, 만약 TabBar의 `isScrollable`이 `true`가 되면 TabBar는 기본적으로 52pixel의 offset을 갖게 된다.  정확히는 `isSc..

백준 11722번 가장 긴 감소하는 부분수열 - C++
Algorithm/PS2024. 11. 23. 16:02백준 11722번 가장 긴 감소하는 부분수열 - C++

문제수열 A가 주어졌을 때, 가장 긴 감소하는 부분 수열을 구하는 프로그램을 작성하시오.예를 들어, 수열 A = {10, 30, 10, 20, 20, 10} 인 경우에 가장 긴 감소하는 부분 수열은 A = {10, 30, 10, 20, 20, 10}  이고, 길이는 3이다. 입력첫째 줄에 수열 A의 크기 N (1 ≤ N ≤ 1,000)이 주어진다.둘째 줄에는 수열 A를 이루고 있는 Ai가 주어진다. (1 ≤ Ai ≤ 1,000) 출력첫째 줄에 수열 A의 가장 긴 감소하는 부분 수열의 길이를 출력한다. 문제 링크https://www.acmicpc.net/problem/11722  풀이다이나믹 프로그래밍을 사용하면 되는 문제다.다이나믹 프로그래밍을 사용하면 쉽게 풀린다는 것은 문제를 보고 바로 알았지만 시행..

백준 2116번 주사위 쌓기 - C++
Algorithm/PS2024. 11. 21. 21:22백준 2116번 주사위 쌓기 - C++

문제천수는 여러 종류의 주사위를 가지고 쌓기 놀이를 하고 있다. 주사위의 모양은 모두 크기가 같은 정육면체이며 각 면에는 1부터 6까지의 숫자가 하나씩 적혀있다. 그러나 보통 주사위처럼 마주 보는 면에 적혀진 숫자의 합이 반드시 7이 되는 것은 아니다.주사위 쌓기 놀이는 아래에서부터 1번 주사위, 2번 주사위, 3번 주사위, … 의 순서로 쌓는 것이다. 쌓을 때 다음과 같은 규칙을 지켜야 한다: 서로 붙어 있는 두 개의 주사위에서 아래에 있는 주사위의 윗면에 적혀있는 숫자는 위에 있는 주사위의 아랫면에 적혀있는 숫자와 같아야 한다. 다시 말해서, 1번 주사위 윗면의 숫자는 2번 주사위 아랫면의 숫자와 같고, 2번 주사위 윗면의 숫자는 3번 주사위 아랫면의 숫자와 같아야 한다. 단, 1번 주사위는 마음대로..

프로그래머스 전력망을 둘로 나누기 - C++
Algorithm/PS2024. 11. 20. 21:15프로그래머스 전력망을 둘로 나누기 - C++

문제  프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr  풀이완전 탐색과 BFS가 섞인 문제다.오늘도 피곤 이슈로... 대략적인 풀이만 올리고 다음에 몰아서 풀이를 올릴 예정이다. 우선 n이 작고, 제공되는 간선의 수도 100 보다 작기 때문에 모든 경우의 수를 다 해볼 수 있다.그러면 첫번째부터 마지막 간선까지 선을 하나씩 제거해나가며 BFS를 돌려보면 된다. 문제 조건이 하나만 끊어도 둘로 나눠지게 설계되어있기에 모든 간선을 한 번씩 끊어보며 확인해보면 된다. 그런데 처음에는 두 번 다 돌려야 하나? 했는데 양 쪽 구간을 모두 확인한다고 두번 돌릴 필요는 없다.n이 정해져있기 때문에 한쪽이 k개라면,..

프로그래머스 소수 찾기 - C++
Algorithm/PS2024. 11. 19. 23:11프로그래머스 소수 찾기 - C++

문제 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr  풀이대략적인 풀이는 오늘 작성하고 자세한 풀이는 내일 작성하겠다... (시간 이슈)next_permutations라는 함수가 있는데, 배열에 있는 다음 순열을 만들어주는 함수다.이를 이용해서 처음부터 끝까지 순열을 만들고 숫자로 바꾸면서 에라토스테네스의 체로 검사를 해주면 된다. 이런 함수가 있다는 걸 알았지만 dfs로 푸는게 좋지 않나 싶어서 재귀적으로 만드는 걸로 했다.이것저것 체크할 게 많아져서 굉장히 귀찮아지지만... 일단 이렇다. 자세하게 어떻게 돌아가는지는 시간이 충분할 때 작성하겠다.  C++ 코드#include #include #inc..

image