이안의 평일코딩

SASS란? CSS를 프로그래밍 언어스럽게 작성가능한 Preprocessor로 CSS에서 변수, 연산자, 함수, extend, import 등을 사용가능하게끔 해준다. 브라우저는 SASS문법을 모르기 때문에 SASS로 작성한 파일을 다시 CSS로 컴파일해야하는데 node-sass를 설치하면 알아서 해준다. node-sass 설치 설치는 npm install node-sass 또는 yarn이 있을 때 yarn add node-sass을 터미널에 치면된다. 그리고 SASS문법을 쓰고싶다면 .CSS 파일이 아닌 .SCSS로 만들면 된다. 그리고 import './파일명.scss'으로 불러온다. SASS 문법 1. 변수에 데이터를 저장 $변수명 : 변수에 넣을 값 Detail.scss $메인칼라 : #ff000..

리액트를 시작하다! 리액트 입문 수업으로 생활코딩을 이틀에 걸쳐 완강했다. (수업링크 : opentutorials.org/module/4058) TMI이지만 사실 국비 과정이 풀스택인줄 알았는데 강의 중간 쯤 알고보니 백엔드 반이라는 사실을 깨달았다. 1차, 2차, 3차 프로젝트를 거치면서 점점 백엔드보다는 프론트엔드에 강력한 매력을 느끼게 되었고 독학을 결심. 이 글은 생활코딩님의 리액트 강의를 듣고 복습 겸 다시 정리해보는 글이오니, 글의 설명이 부족하다고 느낀다면 위의 수업링크를 통해 한 번 수강할 것을 적극 추천하며, 복습용으로 또는 오랜만에 상기용으로 빠르게 훑고 싶은 분들을 위한 글이라고 생각하면 될 것같다. 개발환경 npm run start public > index.html (메인페이지) ..

constructor 컴포넌트가 새로 만들어질 때 호출 getDerivedStateFromProps props값을 state와 동기화시키고 싶을 때 shouldComponentUpdate 컴포넌트가 update할 지 말 지 정할 때 (false은 호출이 안되며 true일 때 호출됨) render 렌더 함수 호출 getSnapshotBeforeUpdate 실제로 브라우저에 반영되기 바로 직전에 값을 확일할 때 componentDidMount Mounting이 끝날 때 componentDidUpdate Updating이 끝날 때 componentWillUnmount Unmounting이 될 때 componentDidCatch 에러발생 시 잡을 때

자바스크립트란? HTML은 구조, CSS는 디자인, 그리고 자바스크립트(JavaScript)는 동작을 담당한다고 생각하면 쉽다. 자바스크립트 프레임워크인 리액트(React), 뷰(Vue.js), 앵귤러(Angular)를 제대로 활용하기 위해서 자바스크립트의 이해는 필수이며 프론트엔드 뿐만 아니라 백엔드 개발자에게도 중요하다고 말하기에 입아픈 언어라고 할 수 있다. HTML 외부에 자바스크립트를 기술하고 싶을 때는 하기와 같이 불러옵니다. 변수 let과 상수 const let은 데이터 값 변경이 가능한 변수이며, const는 데이터 값의 수정이 불가능한 상수이다. 둘 다 데이터 값에 이름을 지정하여 사용하고 싶고 데이터 값을 반복해서 사용하기 위해서 사용한다. // 변수 초기화는 변수 let만 가능하며 상..

7. 애플리케이션 테스트 관리 1) 애플리케이션 테스트 케이스 설계 소프트웨어 테스트 => 개발된 응용 애플리케이션이나 시스템이 사용자가 요구하는 기능과 성능, 사용성, 안전성 등을 만족하는지 확인하고, 노출되지 않은 숨어있는 소프트웨어의 결함을 찾아내는 활동 소프트웨어 테스트 필요성 (발예향, 발가락이 예쁘고 향기롭다) => 오류 발견 관점, 오류 예방 관점, 품질 향상 관점 소프트웨어 테스트 원리 (결완초집 살정오) => 결함이 존재, 완벽한 테스팅 불가능, 초기에 테스팅 시작, 결함집중, 살충제 패러독스, 정황에 의존, 오류-부재의 궤변 살충제 패러독스 => 동일한 테스트 케이스에 의한 반복적 테스트는 새로운 버그를 찾지 못함 오류-부재의 궤변 => 아무리 테스트를 완벽하게 수행해도 사용자가 요구사..

2020.11.17(화) SpringAOPProject3 iancoding.tistory.com/120 Spring 15일차 - AOP 2020.11.17(화) mvnrepository.com/artifact/javax.validation/validation-api/2.0.1.Final Maven Repository: javax.validation » validation-api » 2.0.1.Final javax.validation validation-api 2.0.1.Final.. iancoding.tistory.com src/main/java com.sist.web ReactController package com.sist.web; import org.json.simple.JSONArray; impo..

6. 화면 설계 1) UI 요구사항 확인 UI(User Interface) => 사용자와 시스템 사이에서 의사소통할 수 있도록 고안된 물리적, 가상의 매개체 UI 유형 (CG NO: 이 영화는 CG가 NO) CLI(Command Line Interface) : 명령어를 텍스트로 입력하여 조작 GUI(Graphical User Interface) : 그래픽 환경을 기반으로 한 사용자 인터페이스 NUI(Natural User Interface) : 키보드나 마우스 없이 신체 부위 이용하는 사용자 인터페이스 OUI(Organic User Interface) : 현실에 존재하는 모든 사물이 입출력장치로 변화할 수 있는 사용자 인터페이스 UI 설계 원칙 (직유학유: 정답을 직접 유도하거나 학습시켜서 유도함) 직관..

2020.10.26(월) JavaScript => 태그를 추가, 데이터 변경, 화면 이동 => 이벤트 (프로그래머마다 처리 기능이 틀리다, 통일화) JQuery (DOM프로그램(문서 객체 모델 Document Object Model, 트리형태)) => JavaScript의 라이브러리 exam1.jsp Java Oracle JSP Spring JavaScript exam2.jsp 이름 성별 나이 홍길동 남자 30 심청이 여자 20 박문수 남자 35 exam3.jsp 이름: exam4.jsp