이미지 미리 보기를 구현할 때 가장 많이 사용하는 것이 URL.createObjectURL과 FileReader 두 가지 방법이 존재한다고 한다. 각 방법들은 장, 단점이 존재하므로 어떤 상황에 사용할 것인지 개발자가 의도를 가지고 사용해야 하는 것 같다. 미리 보기 예시 URL.createObjectURL 특징 동기적으로 실행 해시와 함께 URL을 반환하고 문서가 언로드 이벤트(예: 문서 닫기)를 트리거하거나 실행할 때까지 메모리에 개체를 저장합니다 장점 비교적 코드가 간단할 수 있다. 파일을 읽지 않아도 되기 때문에 빠른 성능을 제공할 수 있다. 단점 메모리 누수가 발생할 수 있어 대용량 파일에는 적합하지 않다. 파일 시스템에서 로드되는 것이 아니므로 오프라인 환경에서는 작동하지 않는다. 예제 con..

다음과 같이 포스팅된 글을 카드로 표현하였다. 해당 카드를 누르면 포스팅된 글로 이동하려는 로직을 만들기 위해 카드 내부에서 a태그로 모두를 감쌌다. ... ... 다음과 같이 작성한 후 카드를 눌러보니 메서드를 사용하여 해당 번호를 받아오는 것이 아닌, ${list.getRecommendNo()}를 그대로 주소창에 옮기고 있었다. 이를 해결하기 위한 태그가 있으니 바로 __ (Expression preprocessing, 밑줄 2개)이다. Expression preprocessing 타임리프 공식 문서를 확인하게 되면 Expression preprocessing부분에서 __에 대해 기능을 설명하고 있다. @{/recommends/${list.getRecommendNo()}} 위와 같이 @와 $의 표현식..

CSS 관련 에러가 발생하면서 화면이 제대로 구성되지 않고 있다. MIME ASCII가 아닌 문자 인코딩을 이용해 영어가 아닌 다른 언어로 된 전자 우편을 보낼 수 있는 방식 해당 에러는 CSS 경로가 잘 못 되어 있을 때 발생활 확률이 매우 크다. git pull을 받으면서 CSS가 담겨 있는 경로가 바뀌어버린 것을 인지하지 못하고, 이전 경로를 그대로 입력하면서 발생한 에러. CSS 경로를 정정하니 에러가 해결되었다.

HTML 삽입 미리보기할 수 없는 소스 코드를 옮기는 과정에서 오류발생 소수점 계산 에러.

계산기를 구현하라 1 요구사항 1. 강사님께서 요구한 디자인의 형태(구체적이진 않았음.) 2. 복잡한 계산, 다항 계산이 아닌 345+23 정도의 간단한 계산식을 요구. (23+23*43) 이러한 복잡 계산이 아니었다. 하지만 과제가 이렇다 한들 이렇게 끝내고 싶지 않은 게 사람의 욕심이었다. 추가 1. 소수점 자리 표현 2. 0일 때. 을 제외한 모든 기호의 기능 제한 3. 연속된 기호 입력 제한 4. 왼쪽항과 오른쪽 항의 조건을 충족하였을 때 기호 선택 시 계산 후 결괏값 출력. 5. = 버튼을 눌렀을 때에는 해당 기호에 대한 기능을 수행하고 출력한 뒤 저장 값 초기화. JS 작성 1. input(화면에 보이는 내용)과 모든 버튼(숫자와 기호)들을 전역 변수로 설정 사실 모든 결과값을 누적하여 저장해..

계산기를 구현하라 0 자바의 스프링의 교육이 어느 정도 마쳐질 무렵 프로젝트를 위해 JS교육에 들어갔다. JAVA 웹 프로그래밍 반인데 왜 프런트 앤드에서 쓰일 JS교육을 받느냐면, 웹 프로그래밍 프로젝트를 진행하려면 당연히 화면 부분이 필요한데 우리 반은 Java반으로 화면만을 담당하는 프론트 앤드 학생이 존재하지 않기 때문에 Java를 배우고 있는 우리가 스스로 프런트 앤드 부분까지 해결해야 하기 때문이다. 그렇기 때문에 수업 초기 HTML과 CSS의 교육이 이루어졌으며 프로젝트에 들어가기 전인 지금 간단한 JS를 배우게 된 것이다. 이틀 동안 자료형, 조건문, 반복문, 배열의 문법을 배우고 바로 첫 과제를 내주셨으니 바로 계산기 구현 과제였다. 요구사항 강사님께서 요구하신 계산기의 모형이었고 복잡한..