전체 글

📢SVG란? SVG는 'Scalable Vector Graphics' 의 약어로각 위치 값을 표시하는 벡터와 같은 방식의 2차원 그래픽용 XML 기반의 형식을 이야기한다.   ✅SVG를 사용하는 이유는? PNG나 JPG는 비트맵 기반의 이미지로 각 항목에 하나 이상의 정보 비트를 가지고 있는 표현이다.반면 SVG는 벡터 기반으로 각 좌표에 점을 이어서 만들어지는 개념이다. 벡터 기반의 아이콘은 확대나 축소를 해도 깨지지 않는 것과 같은 원리이다.  ✅프로젝트에서의 SVG 활용 사례내가 참여한 프로젝트에서는 MobileFooter 컴포넌트에 SVG 아이콘을 활용하여 사용자 경험을 개선했다하단 네비게이션 메뉴에서 각 아이콘을 클릭하면 fill이 채워지도록 하졌고 css의 scale을 이용해 크기를 자연스럽..

📢Electron이란? 일렉트론이란 데스크톱 애플리케이션을 구축하는 도구 Electron은 데스크톱 애플리케이션을 개발하기 위한 오픈소스 프레임워크이다. HTML, CSS, JavaScript와 같은 웹 기술을 사용하여 Windows, macOS, Linux에서 실행 가능한 크로스플랫폼 데스크톱 애플리케이션을 만들 수 있다. 물론 Angular, React, Vue도 사용가능하다.   추가로 매년마다 갱신되는 프론트엔드 로드맵 마지막 쪽에서 electron을 찾아볼 수 있다. 그만큼 프론트엔드에서도 나름 중요한 역할을 차지하고 있다는 거 아닐까?   ✅Electron을 활용한 대표적인 애플리케이션우리가 알고 있는 많은 앱들이 이미 electron을 이용하고 있고 추가로 notion,postman도 el..

🧐useSWR란? useSWR은 React에서 데이터를 자동으로 캐싱하고, 재검증하며, 동기화하는 데 도움을 주는 훅(hook)이다. SWR은 Stale-While-Revalidate의 약자로, 오래된 데이터와 새로운 데이터를 함께 처리하는 전략에서 이름을 따왔다. 이 훅은 비동기 데이터 요청에 관련된 복잡한 로직을 쉽게 처리할 수 있도록 설계되었다. ※ 데이터를 자동으로 캐싱한다. 한 번 가져온 데이터를 저장해 두고, 같은 데이터를 다시 요청할 때 서버로 또다시 요청하지 않고 저장된 데이터를 사용하는 것 📌주요기능데이터 가져오기(fetching)useSWR은 주어진 키(key)와 fetcher 함수(API 호출 등을 수행하는 함수)를 사용하여 데이터를 가져온다. 자동 캐싱데이터를 캐시(Cache)하..

✅Servlet이란?클라이언트의 요청을 처리하고, 그 결과를 반환하는  Servlet 클래스의 구현 규칙을 지킨 자바 웹 프로그래밍 기술예를 들어 로그인 페이지에서 사용자가 입력한 데이터를 서버로 보내 로그인 여부를 확인하거나, 특정 데이터를 조회하는 경우에 서블릿이 사용된다. 그때 서버는 클라이언트의 아이디와 비밀번호를 확인하고, 다음 페이지를 띄워주어야 하는데, 이러한 역할을 수행하는 것이 바로 서블릿(Servlet)이다.  ✅Servlet을 쓰는 이유  서블릿을 사용하지 않고 직접 HTTP 통신으로 오고가는 문자열을 파싱하여 서블릿과 같은 기능을 구현해도 무방하지만, 이미 편리하게 사용할 수 있는 서블릿을 놔두고 직접 문자열 파싱을 구현하는 것은 개발자가 온전히 비즈니스 로직에 집중하지 못하게 만들..

✅문제설명왕비를 피해 일곱 난쟁이들과 함께 평화롭게 생활하고 있던 백설공주에게 위기가 찾아왔다. 일과를 마치고 돌아온 난쟁이가 일곱 명이 아닌 아홉 명이었던 것이다.아홉 명의 난쟁이는 모두 자신이 "백설 공주와 일곱 난쟁이"의 주인공이라고 주장했다. 뛰어난 수학적 직관력을 가지고 있던 백설공주는, 다행스럽게도 일곱 난쟁이의 키의 합이 100이 됨을 기억해 냈다.아홉 난쟁이의 키가 주어졌을 때, 백설공주를 도와 일곱 난쟁이를 찾는 프로그램을 작성하시오.✅입출력 예✅입출력 예 설명 아홉 개의 줄에 걸쳐 난쟁이들의 키가 주어진다. 주어지는 키는 100을 넘지 않는 자연수이며, 아홉 난쟁이의 키는 모두 다르며, 가능한 정답이 여러 가지인 경우에는 아무거나 출력한다. 💡내가 생각한 풀이 import java.u..

졸업 후에 부전공으로 들었던 소프트웨어 수업에서 역량이 많이 부족하다는 것을 느끼고 혼자서 1년 동안 공부하다가 여자저차 취업에 성공은 했지만 여전히 부족한 실력과 체계적이지 않은 회사 시스템에 고민이 많아졌다.  그렇게 짧은 회사 생활을 뒤로하고 이제는 혼자서가 아닌 팀플위주의 정교화된 교육을 찾기 시작했고 우리FIS아카데미를 알게 되었다.  http://www.woorifis.com/kor/peoplelife/futureLab/labInfo 1차로 지원서를 제출한 후 합격하고 면접을 본 뒤 최종 합격하여 입과할 수 있게 되었다! 웰컴 호두과자 선물도 받고 지정된 자리에 있는 노트북을 이용해서 수업을 듣는다.첫째주에는 html, css와 관련된 수업을 진행하였고 내가 그토록 바라던 팀플 위주의 git을..

바야흐로,,, 2023년 5월 31일 필기시험을 시작해서 2024년 6월이 되어서야 정보처리기사 자격증을 땄다. 필기 빠르게 따고 실기도 그러할 줄 알았지만,,,,  2번의 불합격의 산을 넘었다. 각각 55점, 51점을 맞았던 것 같다.  사실 준비는 2트째가 가장 열심히 했던 것 같다. 이때 떨어지면 내년까지 기다려야 하는 게 너무너무 싫었고 취준생이었어서 저 정보처리기사 한 줄을 얼마나 쓰고 싶었던지 하지만 어쩌겠냐 떨어진걸! 그 이후로 잠시 정보처리기사는 잊고 지내다가 시간이 흐르고 다시 실기 원서 넣는 시즌이 돼서 부랴부랴 원서 접수 하고 실기 준비를 했다.   아래 사이트에서 책도 사고  https://smartstore.naver.com/yonhapbook/products/5726854189?..

구글 로그인을 적용해보고 있던 중 사람들이 .env 파일을 많이 사용하길래 이게 대체 뭐지 하고 알아보고 싶어졌다!.  📌.env이란? .env 파일은 환경 변수를 저장하는 데 사용되는 파일이다. 환경 변수는 운영 체제나 실행 환경에서 프로그램이나 스크립트가 실행될 때 참조할 수 있는 동적으로 할당된 값이다. 이러한 변수들은 보안, 설정, 구성 데이터를 포함하며, 코드에서 직접 하드코딩하는 것보다 외부에서 관리하는 것이 더 안전하고 유연한다! 1. 루트경로에 .env 파일 생성  2. 필요한 환경 변수를 추가합니다. 예를 들어: DATABASE_PASSWORD=verysecretpasswordAPI_KEY=123abcXYZ 3. gitignore 파일에 .env를 추가하여 Git 저장소에 업로드되지 않..