민우의 코딩일지
article thumbnail
배열에서 원하는 값만 찾고싶을때 - filter(), find()
💻 FullStack/Javascript 2023. 9. 7. 23:11

소개 배열에서 특정 값을 찾아야할 때 유용한 함수중 filter와 find에 대해 간략히 정리해보았다. filter 와 find 모두 데이터 목록(배열)에서 검색한다는 공통점이 있으나, 다음과 같은 차이점이 존재한다. 일치하는 모든 결과를 새로운 배열로 리턴하거나(filter) 혹은 일치한 결과중 첫번째것만 리턴하는지(find)로 나뉘게된다. See the Pen [JS] find(), filter() by minwoo (@ko0or) on CodePen. filter() find() find 잘 몰라서 filter()[0] 썻던건 비밀 ..ㅎㅎ;

article thumbnail
Vue.js 코드 작성할 수 있는 사이트 소개 (Playground)
💻 FullStack/Vue.js 2023. 8. 21. 00:17

간단한 코드 작성은 Vue SFC Playground 지원되는 기능이 적지만, 코드 입력시 반영되는 속도가 빠른편이다. 덕분에 간단한 코드 테스트용으로 좋다. 👉 해당 사이트로 이동하기 조금 더 많은 기능을 원한다면, Javascript Playground 기본적인 Vue 프로젝트 외에도, Element-plus 라이브러리를 적용한 프로젝트로 코드 작성을 해볼 수도 있다 👏👏 다양한 기능을 포함해서 코드를 작성해볼 수 있다는 장점이 있다. 대신, 속도가 조금 느릴순 있다 😅 👉 해당 사이트로 이동하기 블로그를 운영한다면 CodePen 본 티스토리 블로그처럼, 블로거하시는 분들이 많이 사용하는 CodePen 👉 해당 사이트로 이동하기 CodePen An online code editor, learning ..

article thumbnail
데이터 시각화 - Chart.js 라이브러리
💻 FullStack/Vue.js 2023. 8. 20. 22:38

라이브러리 소개 데이터 시각화를 제공하는 무료 라이브러리 📊 다양한 모양(막대바, 선, 동그란 도넛모양 ..등)을 손쉽게 나타내줄 수 있다. 📃 Chart.js 공식 문서 보기 라이브러리 사용 chart.js 설치하기 npm install chart.js 예시 및 설명 기본 옵션을 변경하고싶다면 Chart.js 공식 문서의 좌측 General, Configuration, Chart Types 메뉴에 각각에 대한 세부 옵션들을 확인할 수 있다. 참고로 상단 네비바 우측에 있는 "Sample" 버튼을 누르면 다양한 예시와 코드를 확인할 수 있다. 참고문서 Chart.js | Chart.js (chartjs.org) Chart.js | Chart.js Chart.js Welcome to Chart.js! Wh..

article thumbnail
Spring Data JPA 네이티브 쿼리
💻 FullStack/SpringBoot 2023. 8. 19. 19:10

네이티브 쿼리(Native Query) JPQL을 사용하지않고, 순수 SQL 문법으로 쿼리를 직접 작성해서 사용하는 것을 네이티브 쿼리라고 부른다. 단점 : 실무에서 쓰이지 않는 편 💦 사용하는 방법 사용하는 방법은 매- 우 간단하다. 다음과 같이, 레파지토리에서 @Query(nativeQuery=true, value="쿼리내용") 을 사용하면 된다. // public interface 레파지토리명Repository extends JpaRepository { public interface UserRepository extends JpaRepository { /* @Query(nativeQuery=true, value="쿼리내용") 리턴타입 메소드명(@Param("매개변수명") 타입 매개변수명) *. 참고..

article thumbnail
Spring Data JPA 쿼리 메소드
💻 FullStack/SpringBoot 2023. 8. 15. 17:21

쿼리 메소드(Query Method) JPA에선 쿼리를 직접 작성하지않아도, 메소드 이름에 맞는 쿼리를 만들어주는 기능이 존재하는데, 이번 포스팅에선 findBy ~~~ 로 사용할 수 있는 쿼리 메소드들에 대한 내용들로 정리해보았다. 🐣 📃 관련 문서 Spring Data JPA - Reference Documentation Spring Data JPA - Reference Documentation Example 11. Repository definitions using Domain Classes with mixed Annotations interface JpaPersonRepository extends Repository { … } interface MongoDBPersonRepository exten..