분류
-
[Svelte] Svelte에서 Javascript 없이 검색어 하이라이트 구현나는야 개발자/Svelte 2023. 2. 21. 11:43
오늘은 svelte로 프로젝트를 진행중에 검색어 하이라이트 기능 구현이 필요해 javascript로 검색을 해보았지만 쉬이 답을 얻지 못하였고, 이것 저것 시도해보다 진짜 감동의 쓰나미가 폭풍처럼 휘몰아치듯 너무 감격받아서 포스팅을 안할 수가 없었다. 먼저 Svelte에 대해 간략하게 소개해 드리자면, Rich Harris와 그 팀원들이 만든 Frontend Framework이며 "Not a monolithic Javascript library" 많은 분들이 하도 React, Vue에 익숙해져서 그런지.. 다 javascript 기반의 프레임워크라 생각하는 것 같다.. 하지만, Svelte는 Svelte 언어 그 자체이다. Svelte.js 이런 표현은 맞지않다. 아무튼 지금부터 기록할 내용이 이해가 되..
-
[CSS/SCSS] 항상 까먹는 Text 말줄임표(...) 적용하기 !!!나는야 개발자/CSS 2022. 12. 7. 10:28
안녕하세요~ 오늘 다룰 주제는 !! 'Card' 또는 '게시판 내용 미리보기' 등을 만들때 필요한 " 말 줄 임 표 (...) " 를 적용시켜보려고 합니다. 바로 렛추고( Let's go ) 해볼까용 ? 😁 말줄임표를 적용하는 방법에는 크게 2가지가 있습니다. 1. 1줄로만 보여지는 경우 2. 2줄 이상으로 보여지는 경우 각각의 경우 CSS가 어떻게 적용되고, 차이점이 무엇인지 한 번 알아보겠습니다. 1. 1줄로만 보여지는 경우 .box{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } css를 위와같이 적용시킵니다. Lorem Ipsum is simply dummy text of the printing and typesetting i..
-
[React] react-router-dom | useParams, useSearchParams나는야 개발자/React 2022. 11. 18. 17:35
두고두고 써먹을 나만의 메모장 react-router-dom의 최신 기능 | useParams와 useSearchParams | 기록해 보자구 !! 먼저 URL주소에는 우리가 흔히 알고있는 파라미터 | 도메인주소/parameter1/parameter2/... 쿼리 | 도메인주소/parameter1?key1=value1&key2=value2&... 위의 두 가지 형태가 있다. 1. 파라미터로 연결되는 주소는 메뉴에 depth가 있는 형태 일 때 주로 사용된다. 예 | 쇼핑몰에서 상의 라는 상위 카테고리가 있고, 그 아래에 아우터라는 하위 카테고리가 있을경우 URL : 도메인주소/상의, 도메인주소/상의/아우터 와 같이 쓰일 수 있다. 2. 쿼리는 어떤 경우에 주로 사용하는가? 특정 값으로 조회되는 형태 일 ..
-
[React] 무작정 윈도우 11 구현해보기 !!나는야 개발자/React 2022. 11. 9. 09:55
/* * 주니어개발자의 리액트 이해를 위해 * 무작정 아무거나 만들어보기 시즌 1 !! * * 주제 : 윈도우 11 */ 1. 배경화면(실제 윈도우 화면) 평소 저는 화면 2개를 이어서 하나의 화면 처럼 보고있어서 마치 엄청 긴 모니터처럼 화면이 나오네요..? 아무튼 희생양(?)이 될 디자인입니다 !! 2. 윈도우의 기본적인 시스템을 이해하기 !! 윈도우에서 가장 중요한건 폴더 구현일 것이라 생각을 해 보았습니다. 더블클릭시 폴더가 열려야하며.. 이미 열린 창은 또 열리는것이 아니라 포커스를 주고, 폴더 내에서의 주소 변경과 이동.. 그리고 파일의 실행.. 기타 등등.. 사실 더 깊게 들어가면 지금의 나로써는 거의 불가능에 가까운 일이 되겠지만, 기본적인 모양새만 한 번 만들어보려고 해보았습니다. 3. ..
-
[Java] ChineseCalendar / KoreanLunarCalendar나는야 개발자/Java 2022. 7. 14. 09:57
[개요] 주말과, 공휴일을 제외한 워킹데이만 설정하여 설정일을 기점으로 목표일을 반환해야 하는 기능 구현. 예 ) 7월 8일을 기준으로 3일을 설정 → 7월 12일 리턴 (7월 9, 10은 주말) 예 ) 9월 8일을 기준으로 3일을 설정 → 9월 14일 리턴 (9월 9, 10, 11, 12(대체)는 추석) [문제 해결 아이디어] 1. 이번 문제를 해결하기 위해 본인은 LocalDateTime을 이용하였다. 2. 주말 제외는 LocalDateTime의 getDayOfWeek를 이용하여 쉽게 처리 3. 지정 공휴일 중 양력에 해당되는 공휴일은 하드코딩으로 직접 지정 (신정: 1월 1일, 3.1절: 3월 1일, ... 등) 4. 음력 공휴일에 해당되는 공휴일은 ChineseCalendar와 KoreanLuna..
-
Mac MongoDB connection failed나는야 개발자/React 2022. 6. 6. 00:45
1. 사건의 발단 - Error Occured React 입문 막바지를 향해 달려가고 있다. Window와 Mac 환경에서 각각 구현해보느라 시간이 다소 걸렸는데.. Window의 경우에는 Node.js나 MongoDB / Community / Compass 크게 막히는 것 없이 진행이 잘 되었다. 하지만, Mac은 조금 달랐다. 아직 익숙하지 않은 것도 한 몫 하겠지만, 책에서는 일일이 모든 발생가능한 에러를 다뤄주지 않는다 !! 당연히 개발자라면 에러가 발생했을 경우 스스로 찾아 해결하는 능력이 중요하다고 생각하지만, 아직은 많이 어렵다.. 본론으로 들어가서, 위의 이미지는 Mac 환경에서 MongoDB를 설치하고 $mongo를 실행하면서 발생한 오류다. 이 오류의 내용부터 나와 비슷한 오류가 발생한..
-
[Java/Study] String Calculation(문자열 계산기)나는야 개발자/Java 2022. 4. 28. 16:27
사내에 스터디 모임이 있어서 꼽사리(?)로 나도 한 번 만들어본 "문자열 계산기" !! 코드 전문은 아래와 같다. import java.util.ArrayList; import java.util.List; public class StringCalculation { public static void main(String[] args) { String str = "33+4*21/0"; Operator operator = new Operator(); List returnList = operator.strSplit(str); System.out.println("RETURN LIST :: " + returnList); String result = operator.calculate(returnList); Syste..
-
[01] Node.js 설치 / React 시작하기나는야 개발자/React 2022. 4. 25. 17:26
이제 리액트를 배워야해서 정리를 하면서, 익혀보도록 하겠다 ! 시작에 앞서 React 홈페이지에서 시작하는 방법을 쭉 한 번 읽어 보았다. ( React : https://ko.reactjs.org/ ) 1. Node.js 설치 읽다 보니 create react app을 배우기 위해서는 node.js가 필요하다고 한다. 그래서, 우리는 다시 돌아와 Node.js부터 설치를 해보자 !! https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 위의 사이트로 이동을 하여 OS에 맞는 Node.js를 설치해 주면 되겠다. 설치 후에는 ..