- [ 공부/front-end ]HTML 5API -1일차2023-11-29 16:11:09https://thecatapi.com/ The Cat API - Cats as a Service. A public service API all about Cats, free to use when making your fancy new App, Website or Service. TheCatAPI.com 랜덤 고양이 사진을 제공하는 API promise, axios 예제를 다룰 때 사용했다. 해당 api의 키 값을 사용해 url을 통하여 이미지를 랜덤으로 받을 수 있는데 사용 방법은 아래와 같다. 1.사이트 접속 2.메인에서 get your api key - 본인 이메일로 api 키를 발급받는다. 나는 개인 스터디용이라 Signup for free를 선택함. 대강 내 이메일과 함께 이유에는 js 공부한다..
- [ 공부 ]javascript - this2023-11-29 09:27:18## this용법 1. Tag inline 이벤트 속성에 작성한 this는 tag객체 자신을 가리킨다. ```html ``` 2. 객체메소드(일반함수)의 this는 현재객체를 가리킨다. ```jsx const user = { username : '홍길동', run(){ console.log(`${this.username}이/가 달린다~`); } } ``` 3. 생성자함수(new연산자 호출)안 this는 현재객체를 가리킨다. ```jsx function Pet(name, breed, weight, age, ...colors){ this.name = name; this.breed = breed; this.weight = weight; this.age = age; this.colors = colors; } `..
- [ 공부/front-end ]1128 Javascript 5일차2023-11-28 09:21:221127은 시험/실습으로 진도를 나가지 않았다. input 태그 id:해당 페이지에서 유니크한 변수명 name:실제로 전송에 필요한 속성값 첫글자는 반드시 영소문자 아이디의 길이는 4-12길이 =>첫글자제외하고 3,11 addEventListener onSubmit return false(); return false(); x e.priventDefault(); 유효성 검사 코드는 submit핸들러 호출 시 실행한다. 여기서 유효성검사를 통과하면 실제 제출/ 아니면 prevent로 막는다. http://latentflip.com/loupe http://latentflip.com/loupe/ latentflip.com
- [ 공부/front-end ]JavaScript-5일차2023-11-23 12:14:52클로져,구조분해할당 과제 리뷰 完 prototype:예전타입 class: prototype을 개선 목차 19.WINDOW객체 20.BOM(Browser Object Model) 21.EVENT처리 19.WINDOW객체 window -브라우저 최상위 객체 -탭 별로 하나씩 존재한다. -BOM: Browser Object Model - navigator,history,screen.. -DOM: Document Object Model - document(내가 만든 html문서) -Javascript object(객체) -등등.. open -새 창(탭/팝업)을 여는 함수. -새 창의 window 객체를 반환. 해당 창에 대한 제어 가능. const newWindow = open ("01_hellojs.html"..
- [ 공부/front-end ]Javascript-1일차2023-11-17 12:22:3016실습과제 리뷰 사진갤러리 만들기 flexbox or float 안겹치고 배치되는것 static relative , absolute등을 사용해서 원본이미지와 겹쳐서 큰 이미지 출력 position:relative 부모의 left top이 기준->offset 적용 동일한 이미지 두개를 준비하여 하나는 갤러리리스트처럼 두고, 나머지 하나는 크기n배/숨겨서 마우스 호버시에만 나오게 하기. visibility:hidden; :hover 형제 이미지 visibility:visible; ----- 컨테이너에서는 width:900px이런식으로 너비 고정함. --- float 띄워서 왼쪽/오른쪽으로 보내기 float:left float:right footer clear:both(float무효화 both) float과..
- [ 공부/front-end ]HTML-2일차(CSS)2023-11-15 17:08:58목차 01_hellocss.html 02_selector.html 03_selector_priority.html 04_font.html 05_alignment.html 06_text.html 07_layout_boxmodel.html 08_border.html 09_layout_display.html (각 html별 css파일도 있음) 01_hellocss 태그에서 직접 스타일을 지정하는 것은 지양한다. ex) inline style 속성 아래처럼 css 파일을 따로 만들면 사용/관리하는데 용이하다. 02_selector 1.자식 , 후손 선택자 2.형제 선택자 3.가상 클래스 선택자 4.가상 요소 선택자 03_selector_priority(선택자 우선순위) https://velog.io/@sophia..
- [ 공부/front-end ]HTML-2일차2023-11-14 17:38:47오전:어제 강의 복습 -file - save workspace as - 내가 사용할 프로젝트 폴더 경로에 파일 저장. 해당 파일 실행하면 그 경로에 있는 (생성/실행했던) 프로젝트들이 editor list에 나옴. =>매번 vsc 실행 하지 않고 파일만 실행하면 됨. -gitignore:설정하지 "않을" 파일들 작성(무시할 파일만) -branch 생성 시 보통 목적/이름 이런식으로 네이밍하는게 보기 편함. ex) bugfix/texttest -3-way merge : base / commit1 / commit2 - true merge 이 개념이 좀 헷갈리는데.. 기존의 master에서 작업이 2가지로 분리 됨 master-master / master - feature/animal 이런 경우엔 빨리감기 병..
- [ 공부/front-end ]HTML-1일차2023-11-13 17:53:171.Visual Studio Code 설치 https://code.visualstudio.com/docs/?dv=win64 2.기본 셋팅 및 프로젝트 생성 1.web_client_workspace하위에 5개의 폴더 생성 2.확장 기능 3개 설치 Material Icon Theme 추가 Live Server 추가 GitLens 추가 3.01_html 폴더 - index.html 우클릭 - open with live server 페이지가 작동하지 않습니다 에러 발생. 1)live server config - use local ip 체크 2)우측 하단에서 go live 클릭하여 실행하면 정상적으로 html 페이지 동작. 1초 딜레이 후 자동 저장 visual code studio로 github에 commit ..
- [ 공부 ]1113 -git/sourcetree사용방법2023-11-13 09:58:281. Git - Downloading Package (git-scm.com) Git - Downloading Package Download for Windows Click here to download the latest (2.42.0) 32-bit version of Git for Windows. This is the most recent maintained build. It was released 2 months ago, on 2023-08-30. Other Git for Windows downloads Standalone Installer 32-bit Git for Wi git-scm.com 2. Sourcetree | Free Git GUI for Mac and Windows (sourcetree..
- [ 공부/학습 ]1102 jdbc - day42023-11-02 09:50:46while에서 발생한 오류 - sqlException - 커스텀인 AddressException을 통해 예외던지기 예외로그는 controller에서 보이도록 한다. 다른 클래스단에서는 보이지 않도록 오류까지 통제한다고 생각하기. 금일 db에서 프로시저를 만들고 java프로젝트에서 사용