나디아 성장 일기

Question : 질문 상자(box)를 누르면 내용(content)을 보여주는 바가 내려간다. 사용 언어 - HTML - CSS - Javascript 구조 - index.html - 전체 구조 - index.js - 기능 구현 - main.css - 전체 디자인 코드 구현 계획 버튼 html, css 생성 버튼 누르면 서브 메뉴 열리게 구현 (js) 버튼 누르면 서브 메뉴 열고 닫히게 토글 생성 서브 메뉴가 열려있으면 (if(max-height)) 서브메뉴 닫고(max-height == null) 닫혀있으면 (max-height + "px") css에서 transition에 시간 설정 기능 구현 for문을 이용하여 3개의 버튼에 토글 기능 부여 버튼의 다음 요소(=내용content)를 가지고 온다. ..

Click Counter : 버튼을 클릭하면 증가, 감소, 초기화 기능을 나타내는 페이지 사용 언어 HTML CSS Javascript 구조 index.html - 전체 구조 index.js - 버튼, 글자 디자인 main.css - 전체 디자인 코드 구현 계획 1. 초기 숫자는 0으로 띄움 2. 증가 버튼을 누르면 1씩 증가(+= 1) 3. 감소 버튼을 누르면 1씩 감소(-= 1), (음수 가능) 4. 초기화 버튼을 누르면 0으로 셋팅 (초기 숫자와 같음) 5. **실시간 숫자를 화면에 출력**하기 - 숫자를 보여주는 태그의 id를 innerHTML를 통해 초기 숫자 변수인 main으로 변경한다. index.html Counter // 숫자 보이는 곳 (초기 숫자 0으로 설정) 0 Decrease Re..

📌Java SEMI PROJECT 목차1. 프로젝트 소개주제 기획 의도 기간 개발 환경 참여 부분 2. 어려웠던 점 & 해결 방법 3. 느낀점잘한 점 힘들었던 점 / 아쉬운 점 배운 점  1. 프로젝트 소개주제 지하철 혼잡도 관리 시스템  기간2024-01-29 ~ 2024-02-08  기획 의도관리 지하철 혼잡도를 통한 역 혼잡도 관리서비스 지하철 혼잡도 정보 제공으로 이용객 편의 증진  개발 환경Windows 11 Eclipse (2023-12 R) Java (JDK 21.0.2) GitHub  2. 어려웠던 점 & 해결 방법 1. 협업 툴팀 프로젝트의 꽃은 사실 코드 구현이 아니라 협업이었다.GitHub를 이용하여 매일 공부한 것을 push하고는 있지만  단순히 레파지토리를 생성하고 업로드 하는 ..

Color Flipper : 버튼 클릭 시 배경색이 랜덤하게 변하며 해당 배경색의 색상 코드를 출력하는 사이트 사용 언어 - HTML - CSS - Javascript 구조 - index.html - 'Simple' 버전 - app.js - 'Simple' 버전 - hex.html - 'hex' 버전 - hex.js - 'hex' 버전 - styles.css - 사이트 css 코드 index.html Color Flipper Simple hex Background Color : #f1f5f8 Click Me app.js - 'Simple' const colors = ["green", "red", "rgba(133,122,200)", "#f15025"]; // Simple 선택 시 나오는 색상들 선언 //..

📌 VS code 단축키 파일 열기: Ctrl + P현재 열려있는 파일 닫기 : Ctrl + W열려있는 모든 파일 닫기 : Ctrl + Shift + W이전에 사용한 파일 열기: Ctrl + Q 실행: Ctrl + Alt + N탭 이동: Ctrl + Tab단어 단위로 커서 이동: Ctrl + Left Arrow / Ctrl + Right Arrow 라인 전체 선택: Ctrl + L라인 삭제: Ctrl + Shift + K 줄 복사: Ctrl + D전체 줄 복사: Ctrl + Shift + L블럭 복붙하기: alt + shift + 아래키 최근에 열었던 파일들 간의 이동 : Ctrl + Shift + Tab열려있는 모든 파일 사이에서 이동 : Ctrl + Tab 열려있는 파일을 숫자 키로 이동 : Ctr..

가비지 컬렉션 : 도달하지 못하는 값은 삭제 * 도달 가능한 값 : 접근하거나 사용할 수 있는 값 * 루트 : 현재 함수의 지역 변수와 매개변수, 중첩 함수의 체인에 있는 함수에서 사용되는 변수와 매개변수, 전역 변수 등 - 루트가 참조하거나 루트에서 참조할 수 있는 값은 도달 가능한 값이 된다. 메서드 : 객체 프로퍼티에 행동할 능력을 부여하는 함수 사용법 : 객체.메서드명 = 함수표현식 or 선언된 함수; 새로 함수 선언 let user = { name: "Nadia" age: 23 }; user.sayHi = function() { // 함수 선언 --> 객체 프로퍼티 user.sayHi에 함수 할당 alert("안녕하세요!"); }; user.sayHi(); // 안녕하세요! -----------..

원시값 - 값이 복사 객체값 - 참조값이 복사 객체의 동작 방식 : 객체가 저장되어 있는 메모리의 주소(참조값)이 저장, 복사된다. let user = {name: "Nadia"}; let admin = user; admin.name = "Pete"; // admin의 참조값은 user의 참조값과 같다. alert(user.name); // Pete 출력 객체 참조값 비교 참조에 의한 복사 let a = {}; let b = a; alert(a==b); // true alert(a===b); // true 독립된 개체 let a = {}; let b = {}; alert(a==b); // false 객체 복사 Object.assign : Object.assign(목표 객체, 복사 객체 1, 2...) -..

📌 IntelliJ 단축키 ctrl + W = 단어 지정 (단어 수정에 편리)Alt + Enter = 메서드 생성하기 (다른 클래스의 메서드 가져오기?) ctrl + S = 저장shift + F6 = 패키지, 클래스 이름 변경ctrl + shifr + F10 = 클래스 실행 ctrl + B = 해당 메서드 선언부로 이동shift + F6 = 클래스 내에서 선언된 변수 이름 일괄 수정 alt + Insert = 생성자 만들기- Select None: 빈 생성자 생성

변수 : 변하는 수 변수 선언 var 변수이름 = 초기값; - 초기값은 없어도 가능 - 문자, 문자열도 넣을 수 있음 boolean : true or false 두 가지 값만 가짐 undefined : 변수를 선언했으나 값을 지정하지 않은 것 null : 값이 유효하지 않은 것 typeof(변수 이름) : 해당 변수의 자료형을 알려주는 함수var num = 1; var name = "나디아"; var man = true; var age; doucument.write(typeof(num)); // number doucument.write(typeof(name)); // string doucument.write(typeof(man)); // boolean doucument.write(typeof(age));..

prompt 함수 : 사용자가 입력창에 입력한 값을 받는 함수 (JAVA의 Scanner) 사용법 prompt("문장"); - 입력창에 문장이 표시됨 - 입력창에 내용을 입력하면 콘솔창에 입력 받은 내용이 나옴 prompt("문장", "기본값"); - 입력창에 문장이 표시되고, 기본값이 자동으로 채워져있음prompt("이름을 입력하세요.", "나디아"); alert 함수 : 알림창에 출력되는 함수 사용법 alert("문장");alert("안녕하세요"); document.write 함수 : 화면에 출력되는 함수 사용법 document.write("문장");var name = prompt("이름을 입력하세요.", "나디아"); document.write(name + " 님, 안녕하세요!"); // 출력 결과..