변수 선언 1. var - 새 변수를 생성하거나 선언한다. - myName처럼 이러한 방식으로 대문자를 사용하는 것을 Camel Casing 이라고 한다. 2. let - 변수에 다른 값을 다시 할당할 수 있다. - 변수에 값을 할당하지 않고도 변수를 선언할 수 있으며, 변수는 undefined과 같이 자동으로 초기화된다. 3. const - 상수 변수를 선언한다. - 상수 변수는 선언 시 값을 할당 해야 한다. ! 변수를 다시 할당해야 하는 경우 let를 사용하고 그렇지 않으면 const 을 사용한다. 템플릿 리터럴 ES6 버전의 JavaScript에서는 템플릿 리터럴을 사용하여 문자열에 변수를 삽입하거나 보간 할 수 있다. 1. 템플릿 리터럴은 작은따옴표(')나 큰따옴표(") 대신 백틱(`)(grav..

23-24/Node.js 1 2023. 10. 6. 10:00

JPA JPA는 ORM(object-relational-mapping)으로 객체와 테이블을 매핑해주는 도구입니다. JPA는 기존의 반복 코드는 물론이고, 기본적인 SQL도 직접 만들어서 실행합니다. 또한 SQL과 데이터 중심의 설계에서 객체 중심의 설계로 패러다임을 전환할 수 있고, 개발 생산성을 크게 높일 수 있습니다. JPA를 이용하려면 build.gradle 파일에 아래와 같은 라이브러리를 추가해야합니다. implementation 'org.springframework.boot:spring-boot-starter-data-jpa' JPA를 이용하려면 application.properties 파일에 아래와 같은 설정을 추가해야합니다. // JPA 설정 spring.jpa.show-sql=true sp..

23-24/Spring 2 2023. 10. 6. 10:00

구조 분해 할당 : 구조를 분해해 할당하는 문법 스프레드 연산자 : 반복이 가능한 객체에서 값을 개별 요소로 분리하는 것배열이나 객체에서 요소를 해체해 개별 변수에 그 값을구조 분해 할당 배열의 구조 분해 할당 저장된 요소 값이 순서대로 할당된다. 배열의 길이보다 할당할 변수의 개수가 적어도 오류가 발생하지 않는다 배열의 길이보다 할당 변수의 개수가 많아도 오류가 발생하지 않는다 배열의 길이가 넘는 변수는 undefined가 할당된다. //구조 분해 할당 let arr = [1,2,3]; let [one, two, three] = arr; //배열 arr의 값을 순서대로 변수 one, two, three에 할당함. console.log(one, two, three); 객체의 구조 분해 할당 데이터 저장 ..

23-24/React.js 3 2023. 10. 6. 10:00

1. 컴포넌트 스캔과 자동 의존관계 설정 📌 IOC(Inversion of Control)? 스프링 프레임워크에는 객체를 생성하고 관리하고 책임지고 의존성까지 관리해주는 컨테이너가 있는데 이를 IoC 컨테이너라고 합니다. 📌 스프링 빈이란? 스프링 프레임워크는 스프링 IoC 컨테이너를 가지고 있으며 이 스프링 IoC에 의해 생성되고 관리되는 자바 객체를 빈(Bean)이라고 부릅니다. 스프링은 스프링 IoC 컨테이너에 스프링 빈을 등록할 때, 기본으로 싱글톤으로 등록합니다. 따라서 같은 스프링 빈이면 모두 같은 인스턴스입니다. 💻 회원 컨트롤러에 의존관계 추가 우선 /hello.hellospring/controller 하위에 MemberController 를 생성합니다. MemberController는 M..

23-24/Spring 1 2023. 9. 29. 14:02

스프링은 처음 실행 시 스프링 컨테이너(Spring Container)가 생성됩니다. 스프링 컨테이너는 스프링의 핵심 컴포넌트로, 자바 객체를 관리하는데, 이 자바 객체를 빈(Bean)이라 칭합니다. 빈은 스프링 컨테이너에 의해 관리되는 재사용 가능한 소프트웨어 컴포넌트입니다. 빈은 인스턴스화된 객체를 의미하며, 스프링 컨테이너에 등록된 객체를 스프링 빈이라고 합니다. 스프링 컨테이너는 객체를 생성하고 소멸하며, 클래스 간의 연결을 통하여 각 객체의 의존관계를 주입할 수 있습니다. 섹션 4에서는 스프링 컨테이너가 클래스를 인식하는 방법과 자바 객체를 어떻게 관리하는지 알아봅니다. 스프링 빈을 등록하는 것에는 2가지 방법이 있습니다. 1. 컴포넌트 스캔과 자동 의존관계 설정 스프링 컨테이너가 생성될 때, ..

23-24/Spring 2 2023. 9. 29. 13:56

스프링 빈 등록 컴포넌트 스캔과 자동 의존관계 설정 자바 코드로 직접 스프링 빈 등록 컴포넌트 스캔과 자동 의존관계 설정 MemberController가 MemberService를 통해서 회원가입, 데이터 조회 -> 서로 의존 관계가 있다 @Controller public class MemberController { } `@Controller` 애노테이션이 있으면 MemberController 객체를 생성해서 Spring에 넣어두고 Spring이 관리 -> 스프링 컨테이너에서 스프링 빈이 관리된다 `@Controller` 애노테이션이 있으면 스프링 빈으로 자동 등록 컴포넌트 스캔 원리 `@Component` 애노테이션이 있으면 스프링 빈으로 자동 등록된다 `@Controller` 컨트롤러가 스프링 빈으로..

23-24/Spring 3 2023. 9. 29. 10:00

리액트 기술 블로그에 오신 여러분, 환영합니다! 저희 블로그에서는 리액트(React)에 대한 다양한 기술적인 내용을 다룰 예정입니다. 리액트는 현대적인 웹 개발에서 매우 중요한 역할을 하는 라이브러리로, 빠르고 효율적인 웹 애플리케이션을 구축하기 위한 필수 도구 중 하나입니다. 리액트는 자바스크립트 라이브러리이기 때문에 자바스크립트에 익숙하지 않다면 학습하기 어렵습니다. 기초적인 자바스크립트를 공부했다는 전제 하에 기본적인 자바스크립트 문법을 다시 한번 살펴보고, 이어서 객체의 특징이나 단락평가 같은 실전에 적용할 수 있는 문법을 다루겠습니다. 1. 함수 함수의 사용법을 본격적으로 알아보기 전에, 우리가 함수를 사용하는 이유가 무엇일까요? 자바스크립트 코드를 작성하다 보면 유사하게 동작하는 코드를 작성할..

23-24/React.js 1 2023. 9. 29. 10:00

1. 함수(Function) 'function' 키워드를 사용해 함수 선언한다. fuction 함수 이름 (매개변수) { 함수가 수행하는 명령 } 인수: 함수를 호출하면서 넘겨주는 값이다. 매개변수: 넘겨받은 인수를 저장할 변수이다. fuction 함수 이름 (매개변수) { 함수가 수행하는 명령 } 함수 이름(); //함수 호출문 return문으로 수행한 결과 반환한다. 함수 내에서 return문을 만나면 함수는 종료한다. function getArea(width, height) { let area = width * height; return area; // 수행한 결과 반환 } let result = getArea(10, 20); console.lo..

23-24/React.js 2 2023. 9. 29. 10:00

Javascript란? 자바스크립트에 대해 자세히 살펴보기 전에 우리가 보는 인터넷 웹 페이지 구성에 대해 먼저 살펴보자. 웹 페이지는 HTML, CSS, Javascript 이 3가지의 언어로 만들어진다. HTML은 웹 페이지 요소의 배치를, CSS는 스타일링을, Javascript는 동작을 담당한다. 웹페이지의 주된 목적은 정보 전달 뿐만이 아닌 사용자와의 상호작용이다. 자바스크립트를 사용하여 동적인 기능을 장착할 수 있게 되고 자바스크립트 엔진은 그것을 가능하게 한다. 이것이 오늘날 자바스크립트의 중요성이 점점 커지고 있는 이유이기도 하다. 이제 자바스크립트 문법을 본격적으로 살펴보도록 하자. 변수와 상수 변수는 값을 가리키는 이름이면서 값의 저장소이다. 값 변경이 가능하고 선언과 동시에 할당(초기..

23-24/React.js 3 2023. 9. 29. 10:00

🌟2장 키워드🌟 ES2015 자바스크립트와 프로토타입 비동기 프로미스, async/await AJAX 2.1. ES2015 ES2015는 ES6라 부르기도 하며, 2015년에 새로운 문법을 도입하여 개선된 자바스크립트 문법을 말합니다. 이번 장에서는 ES2015 이상의 자바스크립트에서 알아두면 좋은 문법 몇 가지를 소개하도록 하겠습니다. 2.1.1. const, let 변수 선언이 var에서 const, let으로 대체되었습니다. if (true) { var x = 3; } console.log(x); // 3 if (true) { const y = 3; } console.log(y); // Uncaught ReferenceError: y is not defined var const let 함수 스코프,..

23-24/Node.js 2 2023. 9. 29. 10:00