전체 글 22

[CSS] :has() 선택자에 대해

CSS :has() 선택자에 대해:has 선택자는 '부모 선택자' 또는 '조건부 선택자'라고도 불린다.기본 문법/* 기본 형태 */부모요소:has(자식요소) { /* 스타일 */}브라우저 지원 현황Chrome: 105버전 이상Safari: 15.4버전 이상Firefox: 121버전 이상 (2024년 1월 Release)Edge: 105버전 이상주요 사용 사례1. 자식 요소 존재 여부에 따른 스타일링/* p 태그를 포함한 div에만 스타일 적용 */div:has(p) { background-color: #f0f0f0; padding: 20px;}2. 폼 유효성 검사/* 필수 입력 필드가 비어있을 때 부모 요소 스타일링 */.form-group:has(input:required:invalid..

Publishing 2024.11.28

[FCM] node.js fcm 알림 지연 누락 현상, 우선순위 설정

앱 기능을 위해 node환경에서 fcm을 사용 중인데,테스트를 위해 알림을 보내면 여러개를 보내도 하나만 도착 하는 현상이 발생됐다.지연 된 것인지 누락 된 것인지 확인은 못했지만관련 현상을 찾던 중, 우선순위 관련 옵션을 알게됐다.우선순위FCM 메시지에서 우선순위는 "high" 와 "normal" 두 가지로 설정할 수 있다.각 우선순위의 기능은 다음과 같다.high:즉시 전송되고 디바이스가 절전 상태라도 깨워서 처리.주로 즉각적인 사용자 알림(예: 채팅 메시지, 긴급 알림)에 사용.배터리 소모가 조금 더 클 수 있음.normal:디바이스가 절전 상태이면 네트워크 연결을 기다렸다가 전송.주로 백그라운드 데이터 업데이트(예: 비긴급 데이터 동기화)에 사용.디바이스 배터리 및 네트워크 자원을 절약.코드/**..

etc 2024.11.28

웹 개발자의 앱 개발기 #3.5 앱 디자인, 기능 개발

중간기록 디자인은 잘 몰라서ai가 짜준 코드를 다듬기만 했다.최대한 깔끔하게 하려고 최선을 다했다현재 디자인현재 UI 기능은 보기 방식 변경, 팝업으로 자세히 보기, 테마 변경개발 기능은 보다시피 처음 생각한 필수 기능은 다 붙였다. (끝이란 소린 아님)dart 언어도 보다보니 조금씩 눈에 들어온다.먼저 만들어보고 천천히 공부하는 것도 도움이 되는 듯

[Flutter/Dart] dart의 기본적인 구조, UI가 그려지는 과정 정리

모든 것이 위젯(Widget)입니다HTML 요소처럼 모든 UI 요소가 위젯으로 구성됩니다위젯은 React의 컴포넌트와 유사한 개념입니다레이아웃 구조Column: 세로 방향 배치 (CSS의 flex-direction: column)Row: 가로 방향 배치 (CSS의 flex-direction: row)Container: div와 유사한 범용 컨테이너Stack: 요소들을 겹쳐서 배치 (CSS의 position: absolute와 유사)스타일링 특징CSS처럼 별도의 스타일시트 없이 위젯의 속성으로 스타일 정의모든 크기는 논리적 픽셀(logical pixels)을 사용Theme을 통해 앱 전체의 스타일을 관리 (CSS 변수와 유사)상태 관리// StatelessWidget: Props만 받는 순수 컴포넌트 (R..

etc 2024.11.26

안드로이드 스튜디오, Flutter _key.jks, key.properties 위치 관련

flutter 프로젝트 중 배포를 위해 키를 발급받는데key.properties 파일 위치 관련해서 헷갈린 점이 있어 작성함.관련 오류* Where: Build file 'C:\Users\my_name\Desktop\workspace\wallert_app\android\app\build.gradle' line: 16 * What went wrong: A problem occurred evaluating project ':app'.build.gralde에서 키 파일을 찾기 위해 key.properties를 사용해야 하는데key.properties 파일을 못 찾거나 파일에 문제가 있을 때 나는 오류내 기준 key 파일은 프로젝트 루트에 위치해 있고key.properties파일은 루트>각 앱에 위치해 있어야 ..

etc 2024.11.23

[NAS] 시놀로지 도커, 스케줄러 "예약 작업이 이미 실행 중.." 오류

오류 내용SYSTEM: Scheduled Task [Task 9] skipped because the task was already running. Please check the task content/settings.node를 설치한 컨테이너이고 하루 한번 실행하도록 스케줄을 설정했는데,테스트를 위해 직접 실행을 해보니 이미 실행 중이라 실행을 안 한단다..내용 자체는 오류가 아니지만 내가 원하는 동작을 안 하면 그게 오류지 뭐..ssh로 도커에 직접 접근해 현재 프로세스를 확인해 봤다.ps aux/bin/sh로 접근해 놓고 exit를 안 해서 쌓인 듯하다.for pid in $(ps aux | grep '/bin/sh' | grep -v grep | awk '{print $2}'); do kill -..

Side-Project 2024.11.21

[NAS] 시놀로지 ssh 도커 컨테이너 접근, 폴더 매핑 / 내가 자주 쓰는 명령어

ssh putty를 통한 접속과 기본적인 명령어도커 컨테이너 볼륨과 NAS 폴더 매핑 기능에 대해 다룬다.CMDssh synology-id@domain -p port도메인이 없다면 ip도메인: test.synology.me아이디: id123포트: 22ssh id123@test.synology.me -p 22 PUTTY진입로그인 후 sudo -i를 통해 관리자 권한을 가져온다시놀로지는 보통 기본적으로 root 계정 자체는 비활성화시켜 놓기 때문에일반 사용자로 로그인 후 관리자 권한을 가져오는 것.root로 변경되면 완료. DOCKER이제 도커에 접근하려면docker exec -it [container_name] /bin/shdocker: 도커 호출exec: 현재 실행 중인 도커에 다음 명령을 실행-it: ..

Side-Project 2024.10.18

[NAS] 2024 시놀로지 nas 활용 - 포트포워딩, DSM 외부 접속

시놀로지 DSM에 접속한 모습 (Disk Station Manager)로컬에서만 사용할 수 도 있지만,상태 확인, 또는 기본 기능들을 제대로 사용하려면 포트 포워딩을 통한 외부 접속은 필수다. 포트 포워딩Quick Connect 사용하면 되지 않나? 싶지만퀵커넥트는 포트를 통한 다이렉트 연결이 아니라,시놀로지 측 서버에 한번 경유된 DSM을 조작하기 때문에 기본적으로 느리다.( 시놀로지에서 화면 공유 해준거라 생각하면 편함 )기본적으로 NAS에서 DSM으로 가는 내부 포트는 5000, 5001이다.저기서 설정된 포트를 통해 외부에서 DSM으로 연결되는데,이 포트 그대로 쓰면 보안에 취약하기 때문에 바꾸는 걸 권장한다.포트포워딩은 KT 인터넷 기준으로 http://172.30.1.254/ 가 공유기 어드민..

Side-Project 2024.10.04

[NAS] 2024 시놀로지 nas 활용 - DS224+ 설치, 램 증설

최근 NAS에 관심이 생겨 시놀로지 224+ 모델을 구입했다.클라우드 백업 용도도 있지만도커를 올려 장난감 ? 으로 쓰는 것도 고려했기 때문에 램도 증설하기로 마음먹었다. 설치개인적으로 첫 부팅 전에 램을 넣는 게 나을 것 같아서 부팅 전에 램을 꽂았다. HDD 2번 슬롯을 제거하면 램 연결부가 바로 보이는데,넣을 땐 사선으로 넣고 다 들어가면 아래로 눌러서 장착시킨다.처음 넣을 때 각도를 잘 조절하다 보면 부드럽게 들어가는 각도가 나온다호환되는 램은 여러 가지 말이 많지만찾아보니 2666v의 노트북 용 램이 가장 성공률이 높다고 한다.나는 삼성 16GB 램으로 증설했다 (삼성전자 노트북용 DDR4 16GB PC4-2666V 21300)실제로 구매한 쿠팡 링크 (https://link.coupang.co..

Side-Project 2024.09.30
반응형