Web (26) 썸네일형 리스트형 JavaScrtipt ES12 주요 추가 사항. String.prototype.replaceAll(): 이 메서드는 문자열에서 특정 부분 문자열을 모두 대체하는 데 사용됩니다. replace() 메서드와 달리 모든 발생을 대체합니다. Numeric Separators: 수치 리터럴에서 숫자를 더 읽기 쉽게 만들기 위해 언더스코어(_)를 사용할 수 있습니다. 이를 통해 긴 숫자를 보다 가독성 있게 작성할 수 있습니다. Promise.any(): 여러 프로미스 중 하나가 이행(resolve)될 때까지 기다리는 새로운 메서드입니다. 하나의 프로미스가 이행되면 해당 프로미스를 반환합니다. WeakRefs: WeakMap과 WeakSet에 이어 새로운 자료구조인 WeakRef가 추가되었습니다. 이를 통해 약한 참조를 사용하여 가비지 컬렉션의 대상이 될 수 있는.. 리엑트 샘플링 리액트 기반 프레임워크 Next.js: Next.js는 리액트 기반의 서버 사이드 렌더링(SSR) 및 정적 사이트 생성(Static Site Generation, SSG)을 지원하는 프레임워크입니다. 페이지 기반 라우팅, 코드 분할, API 라우팅 등의 기능을 제공하여 리액트 애플리케이션을 더욱 강력하고 성능이 좋은 웹 애플리케이션으로 만들 수 있습니다. Gatsby: Gatsby는 리액트 기반의 정적 사이트 생성기입니다. GraphQL을 사용하여 데이터를 가져오고, 이미지 최적화, 코드 분할, 자동 프리페치 등의 기능을 제공하여 뛰어난 성능과 검색 엔진 최적화(SEO)를 제공합니다. Create React App (CRA): Create React App은 리액트 개발을 위한 공식 시작 템플릿입니다. 빠르고 간편하게 리액트 .. 리액트 주요 문법과 개념 리액트는 자바스크립트를 기반으로 한 라이브러리로, UI(User Interface)를 만들기 위한 도구입니다. 리액트의 주요 문법과 개념은 다음과 같습니다: JSX (JavaScript XML): JSX는 자바스크립트의 확장 문법으로, 리액트에서 UI를 작성할 때 사용됩니다. HTML과 유사한 문법을 사용하여 컴포넌트의 UI를 정의할 수 있습니다. JSX는 babel과 같은 도구를 사용하여 일반 자바스크립트 코드로 변환됩니다. 컴포넌트 (Components): 리액트의 핵심 개념 중 하나로, 재사용 가능한 UI 조각을 나타냅니다. 함수형 컴포넌트(Functional Components)와 클래스형 컴포넌트(Class Components)로 구현할 수 있습니다. 컴포넌트는 JSX를 반환하는 함수 혹은 클래.. 리액트 처음 시작하기. 자바스크립트 기초 학습: 리액트는 자바스크립트 기반으로 동작합니다. 그러므로 먼저 기본적인 자바스크립트 문법과 개념을 익히는 것이 중요합니다. 변수, 함수, 객체, 배열 등의 기본 개념을 이해하고, ES6의 새로운 기능들도 학습하는 것이 좋습니다. React 공식 문서 읽기: React의 공식 문서는 매우 훌륭하며 상세한 내용을 제공합니다. React의 기본 개념부터 고급 기능까지 다양한 정보를 얻을 수 있습니다. https://reactjs.org/ 온라인 자습서와 강의 수강: React에 대한 온라인 자습서와 강의는 많이 있습니다. Udemy, Coursera, YouTube 등에서 무료 또는 유료 강의를 찾아보세요. React를 처음 접하는 사람들을 위한 입문용 자료부터 심화 내용까지 다양한 강의가.. [RESTFUL] REST API란 REST API가 무엇인가? REST API에 REST는 Representational State Transfer의 약자로 소프트웨어 프로그램 아키텍처의 한 형식입니다. REST api의 등장은 2000년도에 HTTP의 주요 저자 중 한 사람인 로이 필딩이 그 당시 웹(HTTP) 설계의 우수성에 비해 제대로 사용되어지지 못하는 모습에 안타까워하며 웹의 장점을 최대한 활용할 수 있는 아키텍처로써 REST를 발표 하였습니다. REST 구성 REST API는 다음의 구성으로 이루어져있습니다. 자원 (Resource) - URL 행위 (Verb) - Http method 표현 (Representations) - ex) 학생 - > Students REST 특징 REST 아키택처를 이용하여 API를 설계하였을 때.. [JavaScript] 함수 선언문 VS 함수 표현식 함수 선언문 - 코드의 희름 중간에 독자적으로 존재. 함수 표현식 - 표현식이나 구성문구 구문 구성(syntax construct) 내부에 생성됩니다 첫째로 이 둘의 차이점은 함수 형태로 선언하느냐와 변수형 함수형태로 만드는 것이냐의 차이 뿐만아니라 자바 스크립트 엔진이 함수를 생성하는 시점에도 차이가 존재한다. 함수 표현식은 실제 흐름이 해당 함수에 도달했을때 함수를 생성하기 때문에 실행 흐름이 함수에 도달했을 때 부터 해당함수를 사용할 수 있다. 즉 함수 표현식은 선언이된 이후의 코드에서 부터 호출하여 사용가능하다. 함수 선언문은 함수 선언문이 정의되기 전에도 호출할 수 있습니다. 코드내에서 어느 위치에서든 사용 가능하다. 그리고 함수 선언문의 함수가 선언된 블록 안에서만 유효 하기때문에 조건문 안에.. [Java] Timeleaf 타임리프 [1] 타임리프란? Thymeleaf is a Java template engine for processing and creating HTML, XML, JavaScript, CSS, and text. In this article, we will discuss how to use Thymeleaf with Spring along with some basic use cases in the view layer of a Spring MVC application. 즉, html, javascript를 생성하고 처리하기 위한 템플릿 엔진이다. [javascript] var, let, const 차이점 var 는 function-scoped 의 활동 영역을 가지고있고, let 과 const 는 block-scoped의 영역을 가진다. [1] function-scoped(var) function 내부의 영역을 scope로 잡고있기 때문에 var로 선언된 function 외부에서 호출시 해당 변수에 접근을 하지못한다. ** 이미 선언된 변수이름을 다시 재선언해도 문제가 발생하지 않는다. [2] block-scope(let, const) 기존 변수에 같은이름으로 재할당도 허용하는 var의 명확하지 못한 문제점 때문에 ECMAScript 2015 (ES2015)에 재선언이 불가능 한 let과 const가 추가되었다. let은 해당 변수에 값을 재할당 하는것이 가능하지만, const는 재선언과 재할당 모두 불가.. [JPA] JPA 설명 (1) - 사용 이유 [1] JPA 와 ORM 프레임워크 사용 이유. 1) 생산성 만들어진 객체로 데이터베이스를 다루기 때문에 기존 Mybatis와 같은 Mapper 방식에서는 컬럼을 추가하거나 수정하게 되면 전체를 수정하게 되는 방법보다 생산성이 높다. 2) 유지보수성 SQL 쿼리를 직접 작성하지않고 엔티티 필드가 되는 객체를 다뤄 DB를 사용하기 때문에 유지보수가 더욱 간결하다. 3) 성능 일반적인 Spring의 encache 기능처럼 동일한 쿼리에 대한 캐시 기능을 사용한다. 4) RDBMS 종류와 무관 객체 중심으로 동작하기 때문에 Oracle, Mysql, Mssql과 같이 서로다른 환경에서도 문법을 바꿔 마이그레이션을 해야하는 번거로움이 없다. [2] 제약사항 및 단점 JPA는 통계처리와 같이 복잡한 쿼리보다는 실.. [JAVA] hasNext() 와 next() 의 차이 hasNext() 와 next() 의 역할 - Iterator 인터페이스에서 추가적인 요소를 가져오는 역할을 한다. hasNext() - boolean 자료형 타입으로 반환된다. next() - 입력된 값에 따라 원하는 반환값을 가지고온다. 즉, hasNext() 다음에 가져올 값이 있으면 True or False로 존재여부를 판단하고 next()는 가져올 값이 있으면 해당 값을 가져온다. [Jquery] .extend() extend() - 두개 이상의 객체를 합칠때 사용한다. jQuery.extend(target, object1,objectN) 1) target : 합쳐지는 추가 객체 속성을 받을 객체 또는 유일한 인자일 경우 jQuery 네임스페이스로 확장될 객체 2) object1 : 합쳐질 때 기준이 될 객체 3) objectN : 기준 객체에 합쳐질 추가 객체 이전 1 2 3 다음
