코드사냥꾼의 전리품

문제 풀이 import java.io.*; import java.util.*; import java.text.DecimalFormat; class Main { public static void main(String[] args) { Scanner sc = new Scanner(System.in); // 전기 사용량 int num = sc.nextInt(); // 누진세 double price = 0; if(num < 100) { price = (num * 0.5)/100; } else if(num < 200) { price = (num * 0.7)/100; } else if(num < 300) { price = (num * 0.9)/100; } else { price = num/100; } Decimal..

해당 게시물은 생활코딩의 이고잉님 강의를 듣고 개인적으로 정리한 내용을 담고 있습니다👩‍💻 리액트 앱을 배포하기 전에 파일의 용량을 줄여주는 작업(빌드)을 수행한다. 실제 서비스할 때 파일이 용량이 무거우면 사용자 관점에서는 불편함이 생기기 때문이다. 우선, 관리자 도구의 네트워크 탭을 주목해보자 빈 캐시 및 하드 새로 고침 (=캐시 비우기 및 강력 새로고침) 버튼 클릭 후 네트워크 탭을 보면 단순 텍스트가 적힌 웹 페이지임에도 불구하고 1.7MB의 용량을 차지하고 있다. 그 이유는 create-react-app으로 개발 환경을 구축할 때 개발의 편의성을 위해 여러 가지 기능을 자동으로 추가하기 때문이다. 그래서 위와 같이 불필요한 용량을 줄이기 위해 빌드를 하는 것이다. 리액트 앱 빌드하기 npm ru..

해당 게시물은 생활코딩의 이고잉님 강의를 듣고 개인적으로 정리한 내용을 담고 있습니다👩‍💻 리액트로 웹 애플리케이션을 만들기 위해서 개발환경 세팅이 필요하다. 리액트는 npm(node package manager)으로 설치되기 때문에 사전 작업으로 Node.js와 VSCode(필수 X)를 설치하도록 한다. Node.js 설치하기 본인 운영체제 환경에 맞게 설치하면 된다. 최신 버전을 다운받아도 되지만, 안정화 등의 이유로 LTS 사용을 권장한다. 설치 후 윈도우의 cmd창을 열어 npm 설치를 확인한다. npm -v 6.5.0 위와 같이 버전 정보가 출력된다면 성공적으로 설치가 된 것이다. 이후 create-react-app을 활용하여 리액트를 설치해보자 리액트 설치하기 리액트를 설치하는 방법은 두 가지..

본 내용에 들어가기 앞서 Window 객체에 대해 간단히 알아볼 것이다. JSC(Javascript core), DOM, BOM을 포함한 전역 객체이기 때문이다. 이때, F12를 눌러 콘솔 모드를 열어 Window 객체에 접근해보자 위의 예시를 보면 알 수 있듯이 모든 객체들이 Window 객체에 소속되어 있다는 것을 확인할 수 있다. 따라서 우리가 만든 변수, 함수이거나 브라우저가 제공하는 기본적인 내장 함수는 Window 객체의 메소드이다. alert('hello world!'); == window.alert('hello world!'); BOM이란? Browser Object Model의 약자이며, 웹 브라우저에 대한 모든 내용을 담고있는 객체이다. 뒤로 가기, 북마크, 웹 브라우저 새 창 띄우기,..

본 내용에 들어가기 앞서, 자바스크립트는 클래스라는 개념이 없다. 기존의 객체를 복사하여 새로운 객체를 생성하는 프로토타입 기반의 언어이다. 즉, 프로토타입을 사용하여 새로운 객체를 만들어낸다. (참고로, ES6 표준에서 클래스 문법이 추가되었다.) 프로토타입이란? 한국어로는 단순히 원형(원래 형태)으로 번역된다. 말 그대로 객체의 원형이라고 할 수 있다. 자바스크립트의 객체지향 프로그래밍을 지탱하고 있는 핵심 개념이며, 이를 활용하여 상속 개념을 제공하고 있다. [목표] 프로토타입의 기초를 다져보자 아래 코드를 보고 상상해보자. 'o' 객체의 'ultraProp' 프로퍼티에 접근했을 때 어떤 값이 출력될 것 같은가? function Ultra(){} Ultra.prototype.ultraProp = t..

리팩토링이란? 비효율적인 코드를 가독성이 높고, 유지보수가 편리하며, 중복된 코드의 수가 낮은 효율적인 코드로 개선하는 작업이다. 틈틈이 리팩토링 작업을 하는 것이 좋은 프로그래머의 자세이자 좋은 프로그램을 만들 수 있다. [목표] 비효율적인 코드를 제거하는 리팩토링 작업 학습 우선, Night 버튼 기능을 웹 페이지 하단에서도 동작하도록 해보자 이때, 하단 버튼을 클릭하면 버튼의 값이 바뀌는 대상은 상단에 위치한 버튼이다. 그 이유는 input 태그의 id의 값이 동일하기 때문이다. 이 경우 하단 버튼의 id 값을 'night_day2'로 수정하면 정상 작동한다. 그러나, 버튼이 여러 개라면 수많은 버튼을 일일이 변경해줘야 하는 불편함이 발생한다. 이 불편함을 해결하기 위해 this 키워드를 사용한다...