로컬 프로젝트를 GitHub에 처음 올리기로컬에서만 작업하던 프로젝트를 처음 GitHub 저장소에 올리는 절차 자체는 단순하다.git init → git add → git commit → git remote add → git push다섯 단계면 끝난다.하지만 이미 작업 중이던 프로젝트라면 무작정 git init부터 실행하기보다는 현재 Git 상태와 .gitignore, 원격 저장소 상태를 먼저 확인해보는 것이 좋다.01. 올리기 전에 먼저 확인한 것들저장소를 새로 만들기 전에 이미 Git 저장소로 초기화되어 있는지, GitHub CLI(gh)를 사용할 수 있는지부터 확인했다.$ git statusfatal: not a git repository (or any of the parent directories..
@RestController 만들기Controller란?클라이언트의 요청을 받아 비즈니스 로직을 수행할 서비스 계층을 호출하고, 응답을 반환@Controller vs @RestController?Thymeleaf 예시 코드 @RequestMapping("/form") public String form(RequestDTO reqDTO, Model model) { model.addAttribute("codes", codeService.getCodes().getFactory()); // 서비스단 처리 후 응답 결과를 모델에 세팅 후 return "thymeleaf/qna/form"; // view path 반환 }Thymeleaf view 파일 트리 예시Vue나 React 같은 프론트엔..
학습하기 > UI 표현한기React는 사용자 인터페이스(UI)를 렌더링하기 위한 JavaScript 라이브러리다. React를 통해 작은 요소들을 재사용 가능하고 중첩할 수 있는 컴포넌트로 조합할 수 있다.첫 번째 컴포넌트React 컴포넌트는 마크업을 얹을 수 있는 JavaScript 함수이다.표기 시 대문자로 시작하는 경우 React 컴포넌트로 사용하고자 한다고 이해하므로 대소문자 표기 시 주의.컴포넌트는 다른 컴포넌트를 렌더링할 수 있지만, 그 정의를 중첩해서는 안된다.핵심사항React를 사용하면 앱의 재사용 가능한 UI 요소인 컴포넌트를 만들 수 있다.React 앱에서 모든 UI는 컴포넌트이다.React 컴포넌트는 다음 몇 가지를 제외하고는 일반적안 JavsScript 함수이다.컴포넌트 이름은 항상..
React로 사고하기 요약React로 사용자 인터페이스를 빌드할 때, 먼저 컴포넌트 조각으로 나눈다. 그리고 각 컴포넌트의 다양한 시각적 상태들을 정의한다. 마지막으로 컴포넌트들을 연결하여 데이터가 그 사이를 흘러가게 한다.React로 UI를 구현하기 위해 일반적으로 다섯 가지 단계를 거친다.step 1: UI를 컴포넌트 계층으로 쪼개기step 2: React로 정적인 버전 구현하기상호작용 기능은 추가하지 않고 데이터 모델로부터 UI를 렌더링하는 버전 만들기. 데이터 모델을 렌더링하는 앱의 정적인 버전을 만들기 위해 다른 컴포넌트를 재사용하고 props를 이용하여 데이터를 넘겨주는 컴포넌트를 구현.step 3: 최소한의 데이터만 이용해서 완벽하게 UI State 표현하기UI를 상호작용하게 만들려면 사용자..
빠르게 시작하기 요약1. 컴포넌트 생성 및 중첩하기React 앱은 컴포넌트로 구성(컴포넌트는 고유한 로직과 모양을 가진 UI의 일부.)React 컴포넌트는 마크업을 반환하는 자바스크립트 함수function MyButton() {return I'm a button;}export default function MyApp() {return ( Welcome to my app );}다른 컴포넌트 안에 중첩할 수 있다. React 컴포넌트 이름은 항상 대문자로 시작해야 하고 HTML 태그는 소문자로 시작.2. JSX로 마크업 작성하기React 프로젝트는 편의성을 위해 JSX 사용.HTML보다 엄격하여 닫기 태그 필수, 여러 개의 JSX 태그 반환 불가. div 또는 빈 래퍼와 같이 공유되는 부모..
https://learn.jquery.com/ 따라하기 The jQuery Object 새 요소를 생성하거나(또는 기존 요소를 선택할 때) jQuery는 요소들을 컬렉션으로 반환합니다. jQuery를 새로 접해보는 개발자들은 이 컬렉션이 배열과 유사한 속성들과 .length 속성이 있어서 배열인 줄 알고 있습니다. 그러나 사실 jQuery 객체는 그보다 복잡합니다. DOM and DOM Elements Document Object Model (DOM for short)은 html 문서의 표현입니다. 여기에는 수많은 DOM 요소(Elements)가 포함될 수 있고, 고수준에서 DOM 요소는 웹 페이지의 '조각'으로 생각할 수 있습니다. DOM에는 텍스트와 또는 다른 DOM 요소가 포함될 수 ..