개발 아카이브

더미 이미지가 필요할 땐, 로렘 픽숨 (Lorem Picsum)

웹 개발을 하면서 가끔 더미 텍스트가 필요할 때, 로렘 입숨(Lorem Ipsum)을 사용해 보셨을 겁니다. 로렘 입숨(Lorem Ipsum)은 문서나 웹 퍼블리싱, 프론트개발을 할 때 더미 글이 필요할 경우 자주 사용합니다. 글은 그렇다 쳐도, 만약 더미 이미지가 필요할 경우는 어떻게 할까요? 주로 저작권 없는 사진을 다운 받을 수 있는 사이트에서 다운 받아서 사용하곤 합니다. 보통 'unsplash'나 'pixabay'를 사용하곤 합니다. 그런데 이렇게 다운 받아서 사용하는 것은 귀찮지 않나요? 그리고 다운받은 후 사진 크기를 조정하는 작업이 필요하면 정말 귀찮아집니다. 로렘 픽숨 (Lorem Picsum) https://picsum.photos/ Lorem Picsum Lorem Ipsum... b..

[DB] ORDER BY를 했을 때, 정렬 결과가 달라지는 현상

사용하고 있는 DB는 postgreSQL이지만, 다른 DB에서도 다 똑같이 적용된다고 생각합니다. 문제 ORDER BY와 LIMIT를 함께 사용했을 때, LIMIT의 수가 바뀌면 ORDER BY 정렬 결과도 함께 달라지는 현상이 있었습니다. 예를 들어, LIMIT 30과 LIMIT 31의 ORDER BY 결과가 달라지는 것입니다. 실행계획의 차이도 없고 문제의 원인을 알 수 없어서, 구글에서 검색하다가 레딧에서 같은 현상을 겪는 사람을 발견했습니다. 그래서 레딧의 질문을 기준으로 이 현상에 대해 이야기해 보겠습니다. 레딧에서 발견한 동일한 문제 https://www.reddit.com/r/PostgreSQL/comments/ni2l9u/why_is_a_query_with_limit_returning_re..

AWS Lightsail - 라이트세일을 소개합니다.

이번에 운쿠 사이트 개발하면서 AWS Lightsail이라는 사이트를 알게 되었습니다. 그동안 EC2를 사용하기 부담스러웠던 저는 가볍고 가격이 싸면서 쉽게 만들 수 있는 VPS가 필요했습니다. https://aws.amazon.com/ko/lightsail/ 가상 프라이빗 서버 및 웹 호스팅–Amazon Lightsail—Amazon Web Services WordPress, Magento, Prestashop, Joomla와 같은 사전 구성된 애플리케이션을 통해 단 몇 번의 클릭으로 블로그, 전자 상거래 또는 개인 웹 사이트를 구축합니다. aws.amazon.com Lightsail은 AWS에서 만든 가상 프라이빗 서버 (VPS)입니다. Lightsail은 복잡한 EC2에 비해 간편하고 싸게 인스턴스..

[자바스크립트] console.log를 다양하게 쓰자. console 객체

console.log()는 자바스크립트로 개발하면서 아주 다양하게 사용됩니다. 개발자나 사용자에게 여러 정보를 알리는 수단이 되거나 디버깅에 사용되는 용도가 되곤 합니다. 그런데 혹시 console.log()만 사용하고 계신가요? console 객체는 log 함수만 아니라 다양한 함수를 가지고 있습니다. 많은 사람들이 알고 있지만, 모르는 사람은 모르는 console 객체의 함수들을 살펴보겠습니다. ※ 참고로 웹 콘솔 기반의 포스팅입니다. nodejs나 다른 경우는 제외했습니다. 1. console.log(), console.info(), console.warn(), console.error() 처음부터 간단하고 쉬운 것부터 다루겠습니다. 익숙한 console.log()는 매개변수의 문자열을 콘솔에 출력..

Nomad coders - 바닐라 JS로 크롬 앱 만들기 후기

첫 자바스크립트 공부 시작은 노마드 코더의 "바닐라 JS로 크롬 앱 만들기" 강의를 본 것이었습니다. 그래도 일하면서 자바스크립트는 많이 사용했으니 이 정도는 다 알겠지? 하면서 저의 전투력을 측정하는 느낌으로 강의를 들었습니다. 하지만 은근 저도 어이없게 모르는 것도 있고, 원래 몰랐던 것들도 있었습니다. 강의에 대해 이 강의는 momentum이라는 크롬 앱의 기능을 일부 구현해보는 강의로 클론까지는 아니고 기능 구현하기 강의입니다. 제목에서 알 수 있듯이 vanilla js를 배우고 코딩해보는 실습을 가집니다. 배우면서 몰랐던 것 요소 탐색 DOM 탐색은 가장 기초 중에 기초인데, 저는 jQuery에 의존했습니다. 하지만 document.getElementById, document.getElement..

자바스크립트를 공부하기 위한 여정 - jQuery를 벗어내기

2022년 첫 블로그 포스팅입니다. 2022년 기념으로 앞으로 더 나은 개발자가 되기 위해 나아가는 한 걸음에 대해서 이야기해볼까 합니다. 저는 직장에서 풀스택 개발을 하고 있습니다. 하지만 이번에 일을 하나 하면서 자바스크립트에 대해 모르는 것이 많고 부족하다는 생각을 했습니다. 그래서 이번 기회에 자바스크립트를 제대로 기초부터 차근차근 공부해 나아가 보려고 합니다. 사실 지금 이미 공부를 하고 있었는데, 2022년도 첫 포스팅이라 새해 다짐인 느낌으로 말해봤습니다 ㅎㅎ. jQuery는 이제 사용할 필요가 없다. 프론트엔드에서 개발을 쉽고 용이하게 도와줬던 jQuery가 오랫동안 자리를 잡고 있었습니다. 다양한 라이브러리도 jQuery의 도움을 받아 제작되고 그 유명한 부트스트랩도 버전4까지 jQuer..

[Spring] @Autowired를 지혜롭게 하는 법.

이 포스팅은 인프런의 김영한 님의 "스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술" 강의를 보다가 좋은 내용인 것 같아서 참고하여 포스팅했습니다. Autowired 하는 방법은 아마 대략적으로 3가지가 있을 것입니다. 그냥 멤버 필드에 @Autowired 하는 방법 생성자에 @Autowired 하는 방법 Setter에 @Autowired 하는 방법 이 3가지 방법 중, 어떤 방법이 좋은 방법일지, 이번 포스트로 다루어 보겠습니다. 시나리오 package com.min.edu.controller; import com.min.edu.service.MemberService; import org.springframework.stereotype.Controller; @Controller..

정규표현식 문법 공부하기

본 포스트는 프로그래머스 정규표현식 강의를 참조하여 정리한 글입니다. 그래서 프로그래머스 강의에서 나오는 예제 코드와 같습니다. https://programmers.co.kr/learn/courses/11 정규표현식 문법 \d 숫자를 대표하는 글자들(d 는 digit의 약자) \D 숫자를 제외한 문자 \w 글자를 대표하는 글자들 (w는 word의 약자) \W 글자 대표 문자를 제외한 글자들 (특수문자, 공백 등) \s 공백 문자 (스페이스, 탭, 뉴라인) \S 공백 문자를 제외한 문자 + '하나 혹은 그 이상 연결된' 라는 뜻. - \d+ : 연결된 숫자들만 ['02', '123', '4567', '070', '9999', '9999', '010', '2454', '3457'] - \w+ : 연결된 글자..

gitignore 파일을 쉽게 만들어주는 사이트 gitignore.io

안녕하세요. 오랜만에 사이트 소개 포스팅을 하게 되었습니다. 정말 유용한 사이트인데 지금 보니 소개가 안되어 있어서 저장할 겸 소개하고자 합니다. .gitignore 파일을 만들어주는 gitignore.io 라는 사이트입니다. gitignore이란? gitignore에 대해서 모르는 분들을 위해서 설명하겠습니다. gitignore이란 사용자가 git 리포지토리에 올리고 싶지 않은 파일들을 제외 대상으로 설정해주는 것입니다. 예를 들어 특정 IDE 관련 파일이나 빌드 도구 파일, DB 연결 도구 파일 등의 파일들은 굳이 리포지토리에 공유할 필요가 없겠죠? 그리고 공개 리포지토리인 경우 민감한 정보나 중요한 정보를 업로드하는 것을 방지할 수 있습니다. gitignore 설정은 프로젝트에 .gitignore ..