React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 조건문 업그레이드 기존에 사용하던 조건문을 배열 내장 함수를 이용해 조금 더 간략하고 멋지게 써보자. 일단 기존에 사용하던 방식대로 조건문을 작성해보자. // 주어진 음식이 한식인지 아닌지 판별 function isKoreanFood(food) { if(food === '불고기' || food === '비빔밥' || food === '떡볶이') { return true; } return false; }; const food1 = isKoreanFood("불고기"); console.log(food1); // true const food2 = isKoreanFoo..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 단락 회로 평가 논리 연산자를 알고 계신가요? true && true : true false || true : true !true : false 이렇게 세 가지의 연산자 &&(and), ||(or), !(not)를 논리 연산자라고 한다. 논리 연산자는 왼쪽에서부터 오른쪽 순서로 연산을 수행하는데 바로 이 점을 이용해서 단락 회로 평가를 사용?할 수 있다. console.log(false && true); // false console.log(true || false); // true console.log(!true); // false 위의 코드 중에서 우리가 ..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 삼항 연산자 우리가 보통 분기처리를분기 처리를 할 때에는 if문을 사용해서 if와 else 이렇게 혹은 else if까지 사용하면서 분기 처리를 한다. 삼항 연산자는 if와 else 처리를 좀 더 간편하게 사용할 수 있게 해 준다. 삼항 연산자는 세 개의 피연산자를 가져 삼항 연산자라고 불린다. 만약 숫자가 양수인지 음수인지 판별하려는 코드를 if문으로 작성하면 아래와 같다. let num = 4; if(num >= 0) { console.log("양수"); } else { console.log("음수"); } 위의 코드에서는 양수가 출력된다. 그럼 이 if와..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. Truthy와 Falsy 자바스크립트에서는 참 같은 값(Truthy)과 거짓 같은 값(Falsy)이 존재한다. 참이면 참이지 참 같은 값은 뭘까? true와 false를 담을 수 있는 boolean 타입 말고도 다른 데이터 타입에서 true와 false를 반환할 수 있다. let a = ""; if(a) { console.log("true"); } else { console.log("false"); } 위의 코드에서 어떤 값이 출력될까? 자바스크립트에서는 빈 문자열을 false로 인식해 else문에 있는 명령문을 실행한다. 따라서 false가 출력된다. 그럼 ..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 배열의 내장함수 배열의 내장함수를 사용하면 더 깔끔하고 간결하게 코드를 작성할 수 있다. forEach // 기존 for문으로 배열을 순회하는 방식 const arr = [1, 2, 3, 4]; for(let i = 0; i console.log(elm)); // 화살표 함수 이용 /* 1 2 3 4 */ arr.forEach((elm) => console.log(e..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 함수(function) 함수는 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록이다. 이러한 함수는 함수를 정의하고, 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있다. 자바스크립트에서는 함수도 하나의 데이터 타입이다. 따라서 함수를 변수에 대입하거나, 함수에 프로퍼티를 지정하는 행위도 가능하다. 또한, 자바스크립트 함수는 다른 함수 내에 중첩되어 정의될 수 있다. 두 개의 직사각형 넓이를 구하는 코드를 만들어보자. let width1 = 10; let height1 = 20; let area1 = width1 * height1; cons..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 자바스크립트란? 자바스크립트는 HTML과 CSS로 만들어진 정적인 웹페이지를 동적으로 변경해주는 언어이다. 자바스크립트를 많이 사용할까? 2021년도 영어권 기준으로 당당하게 1위를 차지했다. 자바스크립트가 실행되는 곳 자바스크립트 엔진 중 V8이란 엔진은 구글에서 만들었으며 오픈소스이고, C++로 제작되었다. 이 엔진을 Runtime이라고 하는데 엔진이 없는 환경에서는 자바스크립트를 실행할 수 없다. 자바스크립트 엔진을 내장한 웹 브라우저는 Safari, Firefox, Chrome, Edge, Opera 등이 있다. Hello World - 자바스크립트 엔..
React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다. 리액트란? - 자바스크립트의 UI 라이브러리 - Facebook(현 Meta)이 개발한 오픈소스 → 무료! 리액트를 정말 많이 사용할까? 2022 프로그래머스 개발자 설문조사에서 Spring을 이기고 당당히 2위를 차지한만큼 정말 많이 쓰인다. 옆의 이미지를 누르면 해당 설문조사로 이동한다. 프레임워크 / 라이브러리 말고도 다른 흥미로운 내용들도 있으니 한번 구경가보시길 추천. 리액트를 배우면 뭘 만들 수 있나? - Learn once, write anywhere(한번만 배워 모든 곳에 써라) - 리액트에서 파생된 기술인 React Native를 아주 쉽고 빠..
넥사크로 프로젝트 생성 경로는 이클립스 워크스페이스 src\main에 위치 쭉 Next 클릭 후 Finish 이클립스 상에서 프로젝트 src폴더 Refresh Generate Path 설정 Yes 컴포넌트 배치 Form_Work 클릭 확인용으로 아무거나 배치 저장 후 Regenerate 이클립스 프로젝트 Refresh 프로젝트 클린 web.xml 수정 저장 후 서버 실행 이전 게시글 전자정부 표준 프레임워크와 넥사크로 연동하기_1 먼저 톰캣 경로를 간단하게 바꿔준다. 톰캣 더블클릭 Modules 선택 Path 첫 번째 줄 선택 후 Edit Path에 '/'만 남기고 지운다. 저장 후 서버 재실행 pom.xml 추가 tobesoft http://mangosteen.tobesoft.co... devhan.t..
먼저 톰캣 경로를 간단하게 바꿔준다. 톰캣 더블클릭 Modules 선택 Path 첫 번째 줄 선택 후 Edit Path에 '/'만 남기고 지운다. 저장 후 서버 재실행 pom.xml 추가 tobesoft http://mangosteen.tobesoft.co.kr/nexus/repository/maven-public true true com.nexacro.uiadapter17.spring uiadapter17-spring-core 1.0.0-SNAPSHOT org.springframework spring-webmvc org.slf4j slf4j-api com.nexacro.uiadapter17.spring uiadapter17-spring-dataaccess 1.0.0-SNAPSHOT org.springf..
JSP 파일 생성 테스트 화면이니 확인용으로 h1 태그 걸기 Package, controller.java 생성 만약 패키지 경로들이 위의 사진과 같이 안보이면 아래와 같이 설정하면 된다. TestController.java package egovframework.example.test.controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.GetMapping; @Controller public class TestController { @GetMapping("/test.do") public String testPage() { return "test"; } } 저장 후 ..
빨간 네모 모두 삭제(Sample 관련) 삭제된 파일 관련 설정 수정 SQL 관련 폴더 이름 변경 src/main/resources/egovframework/sqlmap의 example 폴더명을 mariadb로 변경(각자 원하는 폴더명 기재) context-mapper.xml 빨간 네모 부분을 수정한다. 수정 sql-mapper-config.xml 에러 표시가 나는 두 줄 주석처리 후 저장 context-sqlMap.xml 주석처리 dispatcher-servlet.xml jsp 하위 폴더를 삭제했기 때문에 위의 부분을 수정해야한다. 이전 게시글 전자정부 표준 프레임워크 설정, 프로젝트 생성 버전 정보 프로그램 로그인 버전 넥사크로17 필요 17.1.3.700 전자정부프레임워크 불필요 3.10.0 자바 ..
버전 정보 프로그램 로그인 버전 넥사크로17 필요 17.1.3.700 전자정부프레임워크 불필요 3.10.0 자바 필요 1.8 톰캣 불필요 9.0 메이븐 불필요 3.8.2 MariaDB 불필요 10.4.21 프로그램 명을 클릭하면 다운로드 사이트로 이동합니다. 개발 폴더 구성 1. 전자정부 표준 프레임워크 2. maven 3. Tomcat 4. 전자정부 프레임워크 workspace 이클립스 이클립스 실행 후 경로 잡아주기 New > other > eGovFrame Web Project 다운 후 팝업 창에서 Open Perspective 클릭 프로젝트가 생성되며 상단 메뉴에 전자정부프레임워크 관련 메뉴가 생긴다. Maven(메이븐) 경로 설정 상단 Window > Preferences > Maven > Us..
