화면을 만들다가 보면 iframe이 필요할때가 있을 때가 있는데 iframe을 넣었더니 길이가 들쭉날쭉하고 스크롤이 생겨버리고 꼴보기 싫다? 그럼 아래와 같은 jQuery를 써주시면 됩니다! function autoResizeIframe() { $('#iframe1').on('load', function() { if(this.contentDocument) { $(this).height(this.contentDocument.documentElement.scrollHeight); } else { $(this).height(this.contentWindow.document.body.scrollHeight); } }); } 이 function을 적용 시키면 이리저리 높이를 맞출 필요없이 적용이 되니 한번 써보시길!

프로그램 개발을 하다보면 동일한 매개변수를 필요한 개수에 따라 오버로딩하여 개발하는 상황이 올 수 있다. 하지만 오버로딩으로 처리가 된다고 해도 동일한 메소드를 매개변수가 늘어남에 따라 추가하는 것은 비효율적이다. 아래 소스와 같은 상황일때 매개변수가 하나 더 필요하다고 하면 매개변수가 4개짜리 매소드를 또 추가하기 찜찜할 것이다. public static void show(String param) { System.out.println(param); } public static void show(String param1, String param2) { System.out.println(param1 + " " + param2); } public static void show(String param1, St..

사용자가 원하는 링크 공유 시 다음과 같이 해당 사이트의 썸네일이나 사이트명에 대해서 크롤링하는 방법이다. Jsoup 은 실제 HTML 작업을 위한 Java 라이브러리입니다. HTML5 DOM 메서드와 CSS 선택기를 사용하여 URL을 가져오고 데이터를 추출하고 조작하기 위한 매우 편리한 API를 제공합니다. URL, 파일 또는 문자열에서 HTML을 긁고 구문 분석 DOM 순회 또는 CSS 선택기를 사용하여 데이터 찾기 및 추출 HTML 요소, 속성 및 텍스트 조작 XSS 공격 을 방지하기 위해 수신 허용 목록에 대해 사용자 제출 콘텐츠 정리 깔끔한 HTML 출력 https://jsoup.org/download 그래들에 1.13.1버전으로 설정했다. implementation 'org.jsoup:jsou..

SQL_CALC_FOUND_ROWS & FOUND_ROWS 페이징 처리를 위해 limit 사용 시 전체 게시물의 수를 알기 위해 쿼리를 한번 더 해야 한다. 1. 해당 조건을 만족하는 게시물의 전체 수 조회 2. 그 페이지에서 보여줄 내용 조회 여기서 조건이 복잡하다면 MySQL에서 제공하는 function을 사용해 보자. SELECT 최상단에 SQL_CALC_FOUND_ROWS 라는 옵션만 주고 FOUND_ROWS() 를 사용하면 된다. 쿼리는 마찬가지로 두번이지만 두 번째 쿼리는 훨씬 빠르다. mysql> SELECT SQL_CALC_FOUND_ROWS * FROM tbl_enchovy WHERE id > 100 LIMIT 10; mysql> SELECT FOUND_ROWS(); 이렇게 하면 첫번째 ..

안녕하세요.🐱‍🐉 얼마 전에 AWS 자격증을 취득해서 자격증을 준비하며 시험과 관련하여 도움된 점, 공부법 등 을 포스팅을 해봐요. 1.1 자격증 종류 1.2 시험 시간 및 비용 1.3 AWS 시험 응시 관련 1.4 AWS 시험 결과 1.5 AWS 공부 방법 1.1 AWS 자격증 종류 자격증 등급 - 기초 (Foundational) - 어소시에이트 (Associate) - 프로페셔널 (Professional) - 전문 분야 (Specialty) ※ 현재는 이전 등급을 합격할 필요 없이 바로 모든 시험을 응시할 수 있어요. 그렇지만 시험 비용이 마냥 저렴하진 않고 합격 시 다른 시험의 비용을 50% 할인해주는 할인 코드를 제공해 주기 때문에, 프로페셔널까지 취득 예정이라면 아래 단계 시험부터 응시하는 것도..

• var, let, const ES6 이후의 환경에서 변수 선언 방식은 기존의 var를 사용하는 한 가지 방법에서 let과 const를 사용하는 두 가지 방식이 추가되어 var, let, const 세 가지 방식이 되었습니다. 처음 ES6를 접했을 때 각각의 선언 방식을 언제 어떻게 사용해야 하는지가 상당히 막연할 텐데 (실제로 실무에서 봐왔던 ES6이후의 환경을 처음 접해보는 개발자들은 대다수가 상수를 제외한 거의 모든 변수 선언에 let을 사용하고 있었습니다.) 아주 틀린 방법은 아니지만, 가장 좋은 방법은 아무래도 각각의 특징을 먼저 이해하고 사용 용도에 맞게 사용하는 것일 것입니다. 이 글에선 세 가지 변수 선언 방식의 동작 방식과 언제 어떻게 사용하는 것이 좋을 지에 대해 정리해보려고 합니다...

안녕하세요.🐱‍🐉 개발자 직무 역량 향상 로드맵을 작성하며 찾아본 자료들을 간단히 첨부하려고 해요. What if there was a plan, a roadmap, that we could consult at any point and see where we are and where to go? As professionals to have a systematic view on a step by step approach on how to evolve and what is worth tackling? 내가 현재 어디에 있고 어디로 가야 할지 계획에 대한 고민이 필요하다면 제시된 로드맵들을 한번 둘러보세요. 어떤 것을, 어떻게 배워야 할지, 나를 위한 나의 직무를 발전시키기 위한 방향성을 생각해보는 것도 좋은..

프로세스 - top : 현재 실행 중인 프로세스 목록(실시간 CPU 사용률) ※ 실시간 모드 정렬 Shift + P : CPU 사용률 순 (기본) Shift + M : 메모리 사용률 순 Shift + T : 실행시간 순 - ps (process status) : 현재 실행 중인 프로세스 목록(프로세스 전체 사용시간 동안의 cpu 사용률) ※ ps로는 현재의 cpu 사용률을 확인할 수 없고 top은 모니터링을 위해, ps는 스냅샷을 위해 사용하면 된다. ※ 자주 사용되는 옵션 → 단일 유닉스 규격 표준을 지원하는 운영 체제 ex. ps -ef | grep 프로세스명 | grep -v grep ps -ef : PID와 PPID 등 확인 가능 ps -ef | grep 단어 : 단어가 포함된 것만 조건부 출력 ..

vue.js 프로젝트 시 검색조건에서 기간을 설정하는 부분에 el-date-picker로 볼 수도 있다. el-date-picker를 처음 보는 사람은 많이 당황스러울 것이다. el-date-picker에 대해 몇가지 옵션들을 살펴보도록 하자. 이것만 알면 el-date-picker 옵션에 대해 편하게 설정할 수 있을 것이다. 아래 el-date-picker 속성값을 하나씩 살펴보겠다. 1 2 3 4 5 6 7 8 cs el-date-picker태그에 type 속성을 보게 되면 대표적으로 4가지를 들 수 있다. type="date" type="week" type="month" type="year" value-format 속성으로 해당 value값을 원하는 형식으로 설정할 수 있다. value-format..

날짜를 계산하는 라이브러리인 moment.js를 사용하면 내장된 함수를 이용하여 간단히 처리할 수 있다. moment 라이브러리를 이용하면 손쉽게 날짜관련 기능들을 구현할 수 있다. npm install --save moment moment 라이브러리를 설치해준다. "moment": "^2.29,1" 버전으로 진행했다. 스크립트에서 import moment from 'moment' 추가해준다. 1 2 3 moment().format() // 현재날짜 moment().format('YYYY-MM-DD HH:mm:SS) // format()함수로 날짜형식 지정 moment('20210930').format('YYYY-MM-DD') // 원하는 날짜를 지정 가능함 cs add()/subtract() - 원하는..

웹 개발자라면 필연적으로 사용하게 되는 HTML이지만 HTML의 태그들은 의미를 알 수 없을 정도로 한 두 글자로 축약한 약어가 많기 때문에 약어의 뜻보다는 기능으로 태그를 외워버린 분이 많을 겁니다. (사실 제가 그렇습니다...🙋‍♂️) 이번 글에선 자주 사용되는 HTML 태그들의 풀네임과 기능을 정리해보겠습니다. ( 이미 n년차 웹 개발자들에겐 아주 친숙한 태그들이기 때문에 대략적인 의미를 알고 있더라도 재미 삼아 읽어보는 것도 좋을 것 같습니다.) 태그 풀네임 뜻 기능 HTML Hypertext Markup Language 하이퍼텍스트 마크업 언어 a (href) Anchor (Hypertext reference) 닻(참조 하이퍼텍스트) 참조 하이퍼텍스트로 이동 b Bold 굵은 활자체 텍스트를 굵..

[Tomcat] 설정 옵션 -server -Xms4096m -Xmx4096m -XX:NewSize=512m -XX:MaxNewSize=512m -XX:PermSize=512m -XX:MaxPermSize=512m -XX:+DisableExplicitGC -verbose:gc -XX:+PrintGCTimeStamps -XX:+PrintGCDetails -Xloggc:/data/logs/gc/gc.log 1. server - Server HotSpot JVM을 사용하는 옵션입니다. Server HotSpot JVM은 Desktop용 Appkication을 구동하는데 유리하고, 최적화(Optimization)에 필요한 모든 과정을 최대한으로 수행합니다. Application의 시작시간은 느리지만, 일정 시간이..

- IE에서는 기본적으로 개발자 도구 > 디버거 탭에서 검색하게 되면 전체검색이 되어 디버깅이 되는 반면에 크롬 개발자 도구는 기본적으로 전체 검색 설정이 되어 있지 않습니다. 크롬 개발자 도구 전체 검색 설정 방법 1. 크롬 개발자 도구 창에서 F1 키를 눌러 설정 탭 진입 > Search in anonymous and content scripts 선택 2. Ctrl + Shift + F 로 검색시 아래와 같이 전체 검색 가능하며 중단점을 걸 수 있습니다.

Session 세션은 접속한 사용자의 상태를 담은 객체입니다. 아파치 웹서버나 톰캣같은 서블릿 컨테이너는 웹환경에서 사용자가 접속중이다 라는 개념이 없으므로 특별한 방식을 사용합니다. 그것은 세션 객체를 생성해두고 일정시간(TIMEOUT)내에 클라이언트가 HTTP 요청을 보낸경우 아직 사용자가 떠나지 않았다고(접속중) 판단하는 방법입니다. Timeout 클라이언트가 서버에 접근하고 최초에 세션이 생성되면 해당 세션객체는 Timeout값을 가지게 됩니다. 그러나 생성직후 timeout만큼 시간이 지나 세션객체가 소멸하는것이 아닌 사용자가 서버에 마지막으로 요청을 보낸이후 timeout 만큼 아무런 요청이 없는 경우 세션객체를 소멸시킵니다. 여기서 클라이언트의 마지막 접속시간(http 요청시각)은 Acces..

When writing a Lambda function, what is the benefit of instantiating AWS clients outside the scope of the handler? A. Legibility and stylistic convention B. Taking advantage of connection re-use C. Better error handling D. Creating a new instance per invocation 람다함수를 작성할 때 AWS 클라이언트를 처리기 범위 밖에 인스턴스화하면 어떤 이점이 있는가? A. 가독성 및 양식적 관습 B. 연결 재사용을 활용 C. 오류 처리 능력 향상 D. 호출당 새 인스턴스 생성 정답↓ 더보기 Correct Answe..