$$config title: 위키 keywords: - 2021.04.13~2021.10.06 - 수업기록 $$

TOP

# 김현정 위키 - 주소 : [to2.kr/cjy](https://to2.kr/cjy) - [개인 블로그 참고 페이지](https://to2.kr/cXm) --- # 관련 위키 - [부분모작위키](https://to2.kr/cv8)/https://to2.kr/cv8 - [LG 시험 페이지](https://to2.kr/cKt)to2.kr/cKt - [4조 기획 위키](https://to2.kr/cMz)https://to2.kr/cMz ## 유용한 링크 - [to2.kr](https://to2.kr/) 주소를 줄여준다. - [Github](https://www.github.com) - [Codepen](https://www.codepen.io) - [Programmers](https://programmers.co.kr) - [Typingclub](https://www.typingclub.com) - [code.org](https://www.code.org) - [수업 자료](https://codepen.io/jangka44/live/wvgmqzz) - [웹디자인 기능사 실기](https://to2.kr/cX8) --- # 공부기록 # 2021-04-13, 001일차 ### 일반 - 유용한 사이트 - [google.com](https://google.com/) - [code.org](https://code.org/) - [repl.it](https://repl.it/) - [github.com](https://github.com/) - [programmers.co.kr](https://programmers.co.kr/) - 수업페이지 - [to2.kr/chf](https://to2.kr/chf) --- # 2021-04-14, 002일차 - ocam [다운](https://ohsoft.net/update/download.php) - [To2.kr](https://to2.kr/) 주소 단축 프로그램 - Tistory 가입 - Youtube 채널 개설 - 김현정 위키 개설 일러스트의 전체선택과 부분선택, 이동, 색상 변경, 입체면 도형 만들기를 배웠다. 코딩에서 Code.org 에서 코딩의 감각을 깨우고 막대 만들기와 CSS에서의 Display이 영역에서 inline-block과 block구조의 차이를 배우고 Codepen.io를 사용해 실습해봄. --- # 2021-04-15, 003일차 - 테이블의 개념을 알게 됨 - a와 br의 역할 - 링크 거는 법(새창으로 띄우기) - 젠코딩으로 네이버, 구글, 다음 가는 링크 만들기 [ocam 설치](to2.kr/chq) [디스코스 설치](to2.kr/ck7) --- # 2021-04-16, 004일차 - www.w3schools.com 코딩 속성 종류 설명 - !항상 display(block, inline-block) 상태 확인해주기 - !background color 넣어서 차지하는 면적 확인하기 - Text align: center; 오직! 글자 정렬 - 도형을 정렬할 경우엔 텍스트화 된 상태에서 가능 boder(외곽선): -px(두께), 테두리 모양(solid, dashed, dotted....) * 글자 가운데 정렬 확인 방법 border:_px;걸고 display="inline-block" 한 다음에 text-align:center;로 확인 해보기. * div:hover(마우스 올려진 상태의 div) ### 젠코딩(옛날에 쓰던 단어)과 EMMET은 같은 말 - 띄어쓰기 하는 방법은 글자 사이에 끼워주기 or - word-spacing:-px; 속성 넣어주기. - text-decoration(태그/ 링크에 생기는 줄 상태 변경): 상태속성넣어주기; --- # 2021-04-17, 005일차(주말) ### BMX (가상)홈페이지 만들기 * 1, 사용하기 * 2, 사용하지 않고 각 아이템 사이의 너비가 동일하게 해주세요. 글자의 width값 설정 * 3, 사용하지 않고 각 아이템의 너비가 동일하게 해주세요. | (바)의 width값 설정 * 4, - 메뉴의 구조 : section>a*7 의 구조 -a 에 width 를 적용하려면, display 속성을 inline-block 이나 block 으로 지정 * 5, -메뉴의 구조 : section>nav*7>a -메뉴의 구조(v2) : section>({|}+nav>a[href="#"]{메뉴아이템 $})*7+{|} -메뉴 아이템안에 있는 a에 display:block --- # 2021-04-18, 006일차(주말) 웹 디자인 입문 강좌에 대해 살펴보았다. 코딩 BMX 페이지 만드는 연습을 했다. - 1~5번 까지의 방법을 사용해 카테고리 간의 간격 조절을 할 수 있다. # 2021-04-19, 007일차 ## [일러스트] 1.오브젝트 정렬 2.패스파인더 ## [코딩] BMX (가상)홈페이지 만들기 --- # 2021-04-20, 008일차 ## [일러스트] - 패스파인더, 펜툴 ## [코딩] - BMX 홈페이지 버젼5로 5분안에 완성시키기
```

| | | | | | ||

``` - 이미지는 고유의 비율이 있음 - [이미지 정렬] v1, nbsp와 br 사용 v2, nbsp와 br 사용, div 하나에 이미지를 3개씩 감싸기 v3, nbsp 사용, div 하나에 이미지를 3개씩 감싸기, div 사이에 section 넣고 높이 지정 v4, nbsp 사용, div 하나에 이미지를 3개씩 감싸기, div 사이에 nav 넣고 인라인 CSS로 높이 지정 v5, nbsp와 br 사용 금지, 이미지 사이에 nav 태그 넣기 v6, nbsp와 br 사용 금지, 각각의 이미지를 nav 태그로 감싸기 - 패딩(padding):박스 안쪽의 여백(좌우 여백주기 가능) 마진(margin):여백 (좌우로 여백주기 가능) - left, top, right, bottom 다 있음 ## ※ 주의 - 이미지의 display: inline 엘리먼트 - a, span, img에는 width height margin padding이 안먹힘 왜냐하면 인라인 구조라서! 기본 인라인 구조는 안 먹힘->그래서 구조 변경 시켜줘야함 --- # 2021-04-21, 009일차 ## [일러스트] * 레이어 생성하기: Ctrl+L - 바운딩 박스 색깔 확인하기 * 입 만들기 object-path-outlinestroke을 이용하여 선을-> 면으로 만들어서 1. 패스파인더 이용해서 합쳐주던지 2. 부분선택 툴로 늘려주기 ## [코딩] - margin: 위아래 ,좌우px; top, right, left, bottom px; - padding: -px; - 이미지 자체에는 패딩을 잘 주지 않는다.(왜냐하면: 코딩이 복잡해지면 힘들어지기 때문!!) 그래서 이미지를 nav 안에 넣어서 패딩을 적용시켜준다. - nth-child(순서배열 규칙) { background-color: 골라;} <[예시](codepen.io/tldkwnstn/pen/abpRedO)보기> ### 중요한 것: - inline-block, inline -수동적으로 정렬 됨 -부모의 text-align 속성에 의해 - blck -능동적으로 정렬 -margin을 이용 -우측:margin-left:auto; -가운데: margin:0 auto; --- # 2021-04-22, 010일차 ## [일러스트] 단축키T의 여러가지 역할 ## [코딩] id="숫자로 시작 금지, -,_둘다 가능 " 똑같은 id가 다른 엘리먼트에 존재할 수 없음 class="" class는 같은 이름의 엘리먼트가 존재할 수 있음 ### class보다 id가 더 쎄다. 그리고 class는 여러가지 중복가능 --- # 2021-04-23, 011일차 ## [일러스트] 펜툴 응용 방법 익히기 ## [코딩] nav: 섹션 격리 section: 메뉴의 1개 1개 div: 메뉴 아이템 a: 메뉴 아이템의 텍스트 의 정의 제대로 알기 body의 노멀라이즈> body:o; --- # 2021-04-24, 012일차 (주말) 코딩 메뉴 만들기 연습 아직 따라만드는데에 있어서 아직 단계확립이 정확하게 되어있지 않아 어려움을 겪었다. --- # 2021-04-25, 013일차 (주말) 코딩 메뉴바 만들기 연습 아직 헷갈리지만, 답을 보지 않고 완성을 시킬 순 있음!(단, 아직 완벽하지는않다.) --- # 2021-04-26, 014일차 ## [일러스트] 색상 변경 둘러싸기 워프(글씨에 굴곡을 줌) 패턴 ## [코딩] ul/ol의 자식은 li만 올 수 있다. ul:순서 없는 리스트 ol:순서 있는 리스트(자주 사용안함) ### ***display(중요) -없어지는 계열:none; -나타나는 계열:가로->inline, inline-block 세로->block # 2021-04-27, 015일차 ## [일러스트] 브러쉬 툴: B 블러쉬 툴 응용해보기 ## [코딩] article:50vh; vh는 %랑 비슷하지만 화면에 나타남 background-color: red !important; 하면 그 줄 색이 중요해져서 보이게 됨 [서브웨이 회의] -첫 페이지 -글씨체(영어,한국어) -핸드폰 이미지 홈 화면 -앱 아이콘 -프로모션 이미지 삽입 -화살표 변경 -앱 아이콘 설명 위치변경 --- # 2021-04-28, 016일차 ## [일러스트] 블렌드 툴 응용하기 ## [코딩] position:static;->원래 모드(사람) relative;->부보에게는 효력이 없지만 자식에게 효력이 생김(사람/유령의집) absolute;->모든 도형 위에 떠있음(유령/유령의 집) transform: translateX(퍼센트) translateY(퍼센트) --- # 2021-04-29, 017일차 ## [일러스트] -블렌드 연습 -3D ## [코딩] - white-space: nowrap; - overflow-x : visible; hidden; scroll;->무조건 스크롤이 생김 auto;->생겨야 될때 생기고 필요없으면 사라짐 - text-overflow:ellipsis; overflow-x :hidden;과 white-space: nowrap;을 해주지 않으면-> text-overflow:ellipsis; 이게 안먹힘 --- # 2021-04-30, 018일차 ## [일러스트] 3D툴 응용 ## [코딩] 2차 메뉴 만들기 시험 --- # 2021-05-01, 019일차(주말) 영상리뷰 올리고 블로그 정리를 조금 한다음 코딩 리디자인 과제를 조금함 --- # 2021-05-02, 020일차(주말) 코딩 리디자인 과제를 조금 한 뒤 3차 풀다운 메뉴 만들기 연습을 했다. --- # 2021-05-03, 021일차 ## [일러스트] 디자인 포스터 구상 자율 자습 ## [코딩] 3차메뉴 풀다운+3차 메뉴 안쪽 방향 펼침 웹 포토폴리오 리디자인 발표(써브웨이) --- # 2021-05-04, 022일차 ## [일러스트] 포스터 -주제: 돗자리 영화제 -컨셉: 포근한 봄날, 흩날리는 벚꽃 아래서의 영화감상 -진척도: 40% -클리핑 마스크(텍스트에 사진 삽입) -일러스트 오브젝트 잠금해제:CTRL+ALT+2 -TRANSPARENCY: 흰색 보이는거 검은색 안보이는거 *ALT누르고 오브젝트나 다른 칸으로 넘어갈 수 있음 ## [코딩] --- # 2021-05-05, 023일차(휴일) ## [일러스트] 행사 포스터 진행 ## [코딩] 홈페이지 바 만들기 연습 --- # 2021-05-06, 024일차 ## [일러스트] 메쉬툴 이용하여 이모티콘 만들어보기 ## 자주 하는 실수 Que:키보드 언어설정 확인하기 - 느낀점: 키보드 언어 설정이 잘못되어있는지 모르고 작업하다가 나중에 깨닫기 때문에 앞으로는 먼저 확인하려고 해야겠다. ## [코딩] 나의 홈페이지 상단 바 꾸미기 ## 자주 하는 실수 Que: 오타가 자꾸 생김 - 느낀점: 오타로 인한 오류로 코드가 먹히지 않을때가 있어서 복사해서 사용하는 습관을 들여야겠다고 생각했다. --- # 2021-05-07, 025일차 ## [일러스트] 포스터 컨펌받고 수정하기 나무 모양 일러스트로 바꾸기 글씨 색 변경 별 모양 다양하게 바꾸기 ## [코딩] 닷네임 코리아 결제하고 도메인 만들어오기 vscode 다운 받고 설정 변경 --- # 2021-05-08, 026일차(주말) vscode 설치하고 설정 바꾸기 --- # 2021-05-09, 027일차(주말) vscode 설정 확인하고 본인 홈페이지 상단바 옮기기 그리고 3차 메뉴 풀다운 vscode에서 해보기 ## 자주 하는 실수 Que: 확인 하는 습관을 가지자 - 느낀점: 외워서 풀다운을 만드는 연습을 하다보니 빼먹는 것이 하나씩 있기때문에 확인하는 습관을 가져야겠다고 생각했다. --- # 2021-05-10, 028일차 ## [일러스트] 완성된 포스터를 가지고 모두와 함께 발표하는 시간을 가졌다. 많은 작품을 보고 카피해봐야겠다는 생각이 든다.... ## [코딩] 내 계정https://github.com/tldkwnstn/blog 내 블로그 사이트 주소 https://tldkwnstn.github.io/blog --- # 2021-05-11, 029일차 ## [일러스트] 대망의 포스터 발표와 제출일 다들 수준급의 실력으로 포스터를 만들어서 발표하였다. 표현력도 표현력이지만 나는 주제 찾는 것 부터 어려움을 겪었기 때문에 지금 부터라도 열심히 찾아보고 익숙해져야 된다고 생각했다. 그리고 카피에 있어 나름 열심히 느낌을 내려고 했지만 만들다보니 나의 미숙한 부분이 저절로 보였다. 이 부분이 너무 아쉬웠기에 앞으로도 카피를 자주 해봐야겠다고 생각했다. ## [코딩] DNSZI 에 가입하고 구매한 도메인을 DNSZI 한군데에서 관리 할 수 있도록 설정을 바꿔주었다. 그리고 전에 VSCODE를 사용하여 만들어 두었던 메뉴 상단바에 CON을 적용해 주었다. CON을 적용하면 뒷 배경은 윈도우에 가득차고 가운데 로고와 메뉴 아이템들은 정해진 넓이 값 안에 갇히게 된다. 그리고 가운데에 작업 박스를 만들어 이미지(그동안의 작업내용의 썸네일)를 삽입해준다. * 이것도 CON을 적용하여 정해진 넓이 값 안에 갇히게 한다. --- # 2021-05-12, 030일차 ## [포토샵] 포토샵 첫 설정을 하고 일러스트와의 차이점에 대하여 학습 ## 자주 하는 실수 Que: 여러가지 작품을 자주 보는 습관을 들이자 - 느낀점: 확실히 이번 과제를 통해 자료 수집이 얼마나 중요한지 알게 되었다. 많이 보고 많이 생각하자. ## [코딩] 메뉴 상단바 연습 ## 자주 하는 실수 Que: 3차 풀다운 손과 눈에 익히기 - 느낀점: 3차 풀다운은 완벽하게 외우지 못했기 때문에... 다른 학습을 진행함에 있어 어려움이 있다. 복습 할때 마다 3차 풀다운의 연습을 하자. ## 계획 - [20시 집도착] - [21시 까지 식사] - [21시부터 공부시작] - [24시 공부 끝] - [25 씻고 잠] - [다음날 10시 유튜브올리기] --- # 2021-05-13, 031일차 ## [포토샵] 사각 선택 영역 툴:M 응용하여 테트리스 배경 만들기 일단 캔버스를 만든다. 사각선택 영역툴로 정사각형 만들어주기 ctrl+d로 선택영역 해제 레이어 늘려가며 모양 만들어주고 ctrl+e를 눌러서 레이어 합쳐주기, 레이어를 합친 뒤 위치를 잡아주면 완성 다른 캔버스에 있는 이미지 합쳐주기 (싸이 이미지 합치기)/레이어 상단 하단 옮기는 것도 같이 배움 매직봉으로 흰부분선택하여 색 채워주기 (신데렐라) ## [코딩] 음수 마진을 이용하여 이미지 여백 제거 ## 자주 하는 실수 Que: 영어 타이핑 연습하기 - 느낀점: 영어 타이핑이 늦어서 수업을 따라가는데에 지장이 있기때문에 조금씩이라도 타이핑 연습을 하자. --- # 2021-05-14, 032일차 ## [포토샵] -퀵 셀렉션툴:마스킹 작업(누끼딸때)시 필요한 부분 -올가미툴: 필요없는 부분 자르고 채워넣을 때 -pupet warp: 이미지 왜곡 -그라데이션(G):그라데이션 효과 ## 자주 하는 실수 Que: 노트폴리오에서 작품 보기 - 느낀점: 항상 지식의 한계를 느끼기 때문에 많은 자료를 봐야겠다고 생각했다. ## [코딩] -img를 div로 감싸서 안에 작품명div와 작업기간div를 만들어서 리스트 작업을 해준다. -아이템에 호버시 이미지가 어두워지는 효과를 준다. -아이템 호버시 이미지가 커지도록 효과를 준다. -아이템 호버시 다른 페이지로 넘어갈 수 있는 추가 버튼을 넣어준다. ## 자주 하는 실수 Que: border나 background-color넣어서 진행 상황 확인하기 - 느낀점: 자꾸 외워서 하려는 습관 때문에 시간이 조금 지나면 금방 잊어버린다. --- # 2021-05-15, 033일차(주말) 코딩 작업 제목과 일시 넣기 div를 사용하여 묶어주기 --- # 2021-05-16, 34일차(주말) 핀터레스트 탐방 마우스 올리면 서서히 어두워지는 효과 넣기 ## 자주 하는 실수 Que: 오타를 줄이자 - 느낀점: 아직 미숙해서 정답을 따라하기 때문에 자꾸 오타가 생겨서 코드가 제대로 먹히지 않는다. 하지만 오타가 생겨서 다시 보게 되는 것도 있으니 나쁘지는 않지만 이해하여 오타를 줄여보자 --- # 2021-05-17, 035일차 ## [포토샵] <요가> 퍼펩웝 컨텐트 어웨어 모디파이 <목각인형> 퍼펩웝 ctrl+t -> 회전 ctrl+j <브러쉬툴> 마우스 우클릭 브러쉬 설정 f5 브러쉬 상세 설정 ## [코딩] *float:left; display:inline-block 처럼 작동한다. block 요소는 float요소를 무시한다. float:left; 는 좌에서 우로 나열된다. float:right; 우에서 좌로 나열된다. clear:both; float 계의 줄바꿈 --- # 2021-05-18, 036일차 ## [포토샵] 브러쉬 이용하여 구름 브러쉬 만들기, 색상 반전시켜서 회색 색을 빼주고 채도를 낮춰서 배경을 거의 흰색으로 바꿔준뒤 명도 변경해서 구름을 브러쉬로 등록 스파이더맨 -백그라운드를 빨강으로 채우고 동그라미로 눈 만들어주고 레이어 복사로 반대편 눈 만들어주기 심슨 -각각 눈 만들고 눈알은 다른 레이어로 만들기 그리고 브러쉬에 shift누르면서 각진 머리 만들어주기 ## [코딩] 이미지 배열 15번까지 마스터 하기 플렉스 익히기(개구리 게임) 3차 풀다운+이미지 배열 30분안에 만들수있게,,, --- # 2021-05-19, 037일차(휴일) 마디아 영상 리뷰 쓰기. 3차 풀다운+이미지 배열 연습 float froggy --- # 2021-05-20, 038일차 ## [포토샵] ctrl+g->ctrl+e해서 일반 레이어로 만들어주고 나서 깨진 글씨 만들기 패턴 만들어서 입력후 새로운 캔버스에 채우기(shift+f5) 그렇게 여러가지 색 채우고 t타입툴로 글씨 써서 글씨에 채워주기 인스타로고 만들기 뭐하나 추가 될때마다 레이어 추가 ctrl+클릭 잘 활용하기 ## [코딩] float속성에 대하여 연구 캘로그 상단바 카피하기 --- # 2021-05-21, 039일차 ## [포토샵] 의자 마스킹 작업 레고 마스킹해서 합치고 브러쉬로 광선검 효과 내주기 ## [코딩] 켈로그 홈페이지 상단바 발표 flex 응용 배우고 적용하기,,, ### 목표 -밑줄 -카카오 뱅크 상단바 구현 -부분 모작 (수요일) 금요일 - [22시 집도착] - [22시 30분까지 씻고] - [22시 30분 부터 밑줄 시작] - [23시 30분 밑줄 끝] - [23시 40분 카카오뱅크 시작] - [24시 40분 카카오뱅크 끝] - [25시 잠] 토요일 - [10시 반 기상] - [11시 밑줄, 카카오뱅크 시작] - [12시 끝] --- # 2021-05-22, 040일차(주말) 켈로그 모작 수정 flex 복습 --- # 2021-05-23, 041일차(주말) flex 복습 GS SHOP모작 시작 --- # 2021-05-24, 042일차 ## [포토샵] 브러쉬툴 지우개툴 스탬프툴 적목현상없애기 ## [코딩] 카카오 상단바 + 이미지 배열 연습 flex, @media --- # 2021-05-25, 043일차 ## [포토샵] LIQUIFY: 디카프리오 얼굴 클리핑 마스크: 곰돌이와 자연 합성 -프레임이 밑에!!!! 이미지가 위로!!! 그리고 사진을 선택하고 CTRL+ALT+G ## [코딩] 카카오페이+이미지배열 시험 *새로운 상단바 메뉴 모작 시작하기 피그마 시작하기 --- # 2021-05-26, 044일차 ## [포토샵] 14주차 디카프리오 얼굴 수채화 느낌 내기 여자 이미지 누끼따고 이미지 합쳐주고 마스크 씌워서 효과 내주기 ## [코딩] 플랙스 복습-개구리 -폭탄 게임 --- # 2021-05-27, 045일차 ## [포토샵] led글자 만들기 슈퍼맨 글자 만들기 ## [코딩] 플렉스 복습 화면 줄어들면 상단바 줄어들며 스크롤바 생기는 것 그리고 스크롤바 없애기 --- # 2021-05-28, 046일차 ## [포토샵] - 마스크응용 비맞는여자 스파이더맨 절찬상영중 편지안에 글자넣기 ## [코딩] - 자바스크립트 *자바스크리트 구성요소 -변수:값 저장소, 공간 -변수에는 값이 무조건 1개!!! (변수 선언/생성/초기화->let x(예시); x=10;) -값(데이터) -문장 -숫자 * 기록->console.log(); 변수->let:a; a=~ --- # 2021-05-29,047일차(주말) 피그마 수정 포토샵 스파이더맨 --- # 2021-05-30,048일차(주말) 피그마 최종수정 새로운 모작 시작 --- # 2021-05-31,049일차 ## [포토샵] 그동안의 배운것들 응용 url참고:[https://omel.tistory.com/155](https://omel.tistory.com/155) ## [코딩] - 2가지 - 변수 - 데이터 - 실행불가능 - 숫자 - 문장 - 참거짓 - 객체 - 실행가능 - 함수 코드조각을 모아놓을수 있는것/function k[이름 겹치면 안된다.] (소괄호) {중괄호} k();->k를 실행하라는 의미 --- # 2021-06-01,050일차 ## [포토샵] - 포토샵 마무리 특이한 문자 만들기 (마블- 아이언맨) ## [코딩] - function 에 대해 배움 15~18강 --- # 2021-06-02,051일차 ## [포토샵] - 컨펌진행 목요일 비대면이라서 금요일에 다시 진행 ## [코딩] - 팝업창 만들기(5분안에 만들 수 있게 연습하기) - [계획] - 20시 집도착 - 20시반 운동 - 22시반 집도착 - 23시 공부시작 - 24시 1차 녹화 끝(포스터 만들기)[1단계] - 25시 2차 녹화 끝(포스터 만들기)[2단계] - 25시반 취침 - 10시 기상 - 11시반 3차 녹화 끝(코딩 팝업 연습)[3단계] --- # 2021-06-03,052일차 ## [포토샵] - 컨펌진행 금요일에 다시 진행 * 라우드 소싱, 디자인 정글(공모전) ## [코딩] - addClass removeClass has - [계획] - 20시 집도착 - 20시반 운동 - 22시반 집도착 - 23시 공부시작 - 24시 1차 녹화 끝(포스터 만들기)[1단계] - 25시 2차 녹화 끝(포스터 만들기)[2단계] - 25시반 취침 - 9시반 기상 - 11시반 3차 녹화 끝(코딩 팝업 연습)[3단계] --- # 2021-06-04,053일차 ## [포토샵] - 컨펌진행 7일 발표/ ??일 tms 제출 ## [코딩] - 팝업만들기 1개, 2개, 2개를 1개로 팝업 닫고 열고 함수 이용하여 x표에 애니메이션 넣어주기 - 24강 풀기 문제 1 단계 0단계 : HTML : button.btn-1{버튼 1}, CSS : body.active { background-color:red;} } 1단계 : console.clear(); 2단계 : jQuery 불러오기 3단계 : $('.btn-1').click(function() { console.log("클릭됨"); }); # 확인 필수 4단계 : $('.btn-1').click(function() { let has = $('div').hasClass('active'); console.log(has); }); # 확인 필수 5단계 : $('.btn-1').click(function() { let has = $('div').hasClass('active'); $('body').addClass('active'); }); # 확인 필수 6단계 : $('.btn-1').click(function() { let has = $('div').hasClass('active'); if ( ?? ) { ?? } else { ?? } }); # 확인 필수 --- # 2021-06-05,054일차(주말) 포스터 제작 --- # 2021-06-06,055일차(주말) 포스터 제작 및 코딩 복습 --- # 2021-06-07,056일차 ## [포토샵] - 발표진행/ ??일 tms 제출 ## [코딩] - 매개 변수로 팝업 제작 - default prventdefault - alert:경고창 - confirm:확인창 - 33강 1단계 : 정답에서 HTML 복사(제이쿼리 불러오기) 2단계 : 정답에서 CSS 복사 3단계 : console.clear(); 4단계 : Popupinit 함수 만들고 실행 5단계 : .btn-popup-1 클릭 이벤트 6단계 : .btn-popup-1 클릭시 팝업1 뜸 7단계 : .popup-1 .popupbtn-close 의 닫기 버튼 클릭시 팝업1 닫기 8단계 : 팝업 열기 no 변수 적용 9단계 : 팝업 닫기 no 변수 적용 10단계 : no를 매개변수 화 11단계 : popup-3 구현 --- # 2021-06-08,057일차 ## [포토샵] - 발표진행/ 9일 tms 제출 ## [코딩] 팝업1,2,3 구현 스크롤바 생기게해서 넓이 좁아져도 팝업 끌수 있게 하는 것 연습하기 ### 자주 하는 실수 Que: 자바스크립트 쓸때 확인하는 습관 기르기 - 느낀점: 처음 코딩을 배울때 처럼 외우기만 하면 안되는 자바스크립트,, 멘붕이 오지만 강사님이 알려주신 순서로 연습하다보면 금방 익힐 수 있을 것 같다. --- # 2021-06-09,058일차 ## [포토샵] - 발표진행/ 오늘 tms 제출 ## [코딩] - 팝업 동시에 두개 열기 ### 자주 하는 실수 Que: 자바스크립트 쓸때 확인하는 습관 기르기 - 느낀점: 처음 코딩을 배울때 처럼 외우기만 하면 안되는 자바스크립트,, 멘붕이 오지만 강사님이 알려주신 순서로 연습하다보면 금방 익힐 수 있을 것 같다. --- # 2021-06-10,059일차 ## [코딩] - 함수의 2대 구성요소 -변수 -데이터(값) -실행가능 -함수 -실행 불가능 -숫자 -문자 -참/거짓 -객체(묶음) - 함수 2대 제어 -조건 -반복 - 스와이퍼 [계획] - 19시반 식사 - 20시 휴식 - [1단계]21시반 1차 녹화 끝(팝업 복습, 위키/ 블로그 정리) - [2단계]22시반 2차 녹화 끝(웹페이지 모작) - [3딘계]23시반 3차 녹화 끝(피그마) --- # 2021-06-11,060일차 ## [코딩] - 스와이퍼 이용하여 슬라이드 만들기 상단2개 하단 3개 나오는 슬라이드 까지 만들기 - 테일윈드 사용법 학습 - css diner (5분 안에 완성) - flex froggy (5분안에 완성) - flex 디펜스 (20안에 완성) [계획] - 21시 집 도착 - 22시반 1차 녹화 끝 (개구리 5분 완성) - 23시반 2차 녹화 끝 (flex 디펜스) - 24시반 3차 녹화 끝 (슬라이드 복습) --- # 2021-06-12,061일차(주말) 부산 국제 영화제 홈페이지 모작 flexbox-froggy --- # 2021-06-13,062일차(주말) 부산 국제 영화제 홈페이지 모작 flexbox-defense --- # 2021-06-14,063일차 ## [코딩] flex-shrink:줄어드는 것 (기본값1, 0이면 안줄어듦) flex-basis:row일때 넓이 column일때 높이 - cAC 48강 답)html[class*="popup-"][class*="-actived"] { } - 49강 숙제 popup__body에 height 삭제 flex-grow:1;추가 popup__body의 부모인 popup__content에 display-flex; max-height:100%; flex-direction:column; box-sizing:border-box; 추가 --- # 2021-06-15,064일차 ## [코딩] - 아코디언 탭 ☆this 사용법 $(this) 사용하고 싶으면 무조건 let $this = $(this); 만들어주기 - 피그마 / 컴포넌트 to2.kr/cGG --- # 2021-06-16,065일차 ## [코딩] - 제이쿼리 좋은점 함수명이 짧다 -document.getElements=>$ 일괄처리가 가능하다 중간 단계를 거치지 않아도 알아서 전달해줌 - [아코디언 탭 응용:URL](https://codepen.io/tldkwnstn/pen/qBrgBvN) - 아코디언 탭 응용 예제 60강 부터 next()인접동생 prev()인접형 parent()부모 children()자식 find()후손 siblings()형제/자매 --- # 2021-06-17,066일차 ## [코딩] - 동아연필 연습하기 to2.kr/cAC 64강,65강,66강 - 아식스 부분 모작 로고 object-fit:contain; 알아두기 [코딩 이미지 삽입시 사용되는 속성:https://nykim.work/86](https://nykim.work/86) --- # 2021-06-18,067일차 ## [코딩] - PC 탑바, 모바일 탑바, 사이드바 연습 to2.kr/cAC 67강 이어서 만들기 --- # 2021-06-19,068일차(주말) ## [코딩] - 어제 만들어둔 것으로 PC 탑바, 모바일 탑바, 사이드바 연습 --- # 2021-06-20,069일차(주말) ## [코딩] - PC 탑바, 모바일 탑바, 사이드바 기본적인 것은 1시간 안에 만들기 연습 --- # 2021-06-21,070일차 ## [코딩] - LG 홈페이지 시험[to2.kr/cKt] --- # 2021-06-22,071일차 ## [코딩] - LG 홈페이지 시험 이어서 + 발표 - 모바일 앱 기획 - 아코디언 탭 마무리-1 --- # 2021-06-23,072일차 ## [코딩] - 아코디언 탭 마무리-2 - show/hide fadeIn/Out(2000)->2초 : 넣어주면 2초동안 나옴 slideDown/Up(5000)->5초 : 넣어주면 5초동안 나옴 - 참고 : [https://codepen.io/jangka44/pen/WNpqxbe](https://codepen.io/jangka44/pen/WNpqxbe) - 연습 : [https://codepen.io/tldkwnstn/pen/dyvBXwa](https://codepen.io/tldkwnstn/pen/dyvBXwa) - ctG : 스크롤 트리거 /설명 페이지 - cNy : 스크롤 트리거 참고 /수업 페이지 - green sock <--! HTML - CSS기초 - flex - 테일윈드 - 자바스크립트 기초, 제이쿼리 - 팝업 - 모바일 사이드바 - --> - 애니메이션 - 제이쿼리 애니메이션 - TweenMAX - TweenLite + ScrollMagic - GSAP - 플러그인, 스크롤 트리거 --- # 2021-06-24,073일차 ## [코딩] - 목소리는 크고 분명하게 - 성량은 가장 끝 뒷자리에서도 편하게 들을 수 있어야 합니다. - 본인 위키 단축주소는 외워서. - 회사에서 업무 보고 한다는 생각으로 해야 합니다. - 청중은 나에게 윗사람이 라고 생각, 존대말 사용 - 말투도 중요합니다. 건성이라는 느낌이 들면 안되니 주의해주세요. - 발표는 느리지 않게 - 링크 열때는, Ctrl + Click - 링크 닫을 때는, Ctrl + W - 발표가 끝나면, 꼭 이상입니다. - 메뉴 탭 cAC 79강 참고 --- # 2021-06-25,074일차 ## [코딩] - 모작 발표 - 앱 기획 보고서 준비(조사 / 분석) --- # 2021-06-26,075일차(주말) ## [코딩] - ppt 템플릿 찾기 - 일룸 로고 구상하기 - 표지, 목차 ppt만들기 --- # 2021-06-27,076일차(주말) ## [코딩] - 일룸 앱 로고 만들기 - ppt 만들기(페르소나, 컨셉 부분 이미지 찾기) --- # 2021-06-28,077일차 ## [코딩] - 슬라이드 여백 넣기, 갯수 바꾸기 - 슬라이드 버튼 아래로 내리기 - 슬라이드 버튼 중간으로 보내기 - 슬라이드 버튼 커스텀(내일 이어서) --- # 2021-06-29,078일차 ## [코딩] - 일룸 앱 기획 보고서 발표 - 슬라이드 응용 - 슬라이드 방향키 커스텀 --- # 2021-06-30,079일차 ## [코딩] - 슬라이드 텍스트 커스텀 - 스와이퍼cFe 14강 --- # 2021-07-01,080일차 ## [코딩] - 스와이퍼cFe 20강 --- # 2021-07-02,081일차 ## [코딩] - 일룸 앱 와이어 프레임 - 웹 디자인 기능사 기출문제 풀기 --- # 2021-07-03,082일차(주말) ## [코딩] - 일룸 앱 와이어프레임 - 웹 디자인 기능사 시험 --- # 2021-07-04,083일차(주말) ## [코딩] - 일룸 앱 와이어프레임 --- # 2021-07-05,084일차 ## [코딩] - 와이어 프레임 발표 - 앱 디자인 시안 회의 - 클래스101 이미지 슬라이드 --- # 2021-07-06,085일차 ## [코딩] - 앱 디자인 시안 만들기 - 두산연강 슬라이드 만들기 - 클래스 101 이미지 슬라이드 --- # 2021-07-07,086일차 ## [코딩] - cFe 31강 만들기 - 앱 시안 만들기 --- # 2021-07-08,087일차 ## [코딩] - 앱 시안 만들기 - 스와이퍼 슬라이드 복습 -두산연강 --- # 2021-07-09,088일차 ## [코딩] - 앱 시안 만들기(프로토타입 연결) - 모작 발표 - git 사용법 - 개념 원격 리포지터리에 파일을 바로 올릴 수 없다. 로컬 리포지터리에 담은 후, 로컬 리포지터리 자체를 업로드 해야 한다. 작업 폴더의 파일들을 로컬 리포지터리에 담을 때는, 먼저 장바구니에 담아야 합니다. 커밋은 장바구니에 담긴 파일들을 로컬 리포지터리에 담는 것을 의미 합니다. 푸시는 로컬 리포지터리 자체를 원격 리포지터리로 업로드 하는 것 입니다. - 로컬 리포지터리 만드는 명령어 -git init 로컬 리포지터리를 생성 로컬 리포지터리 만든 후 1번은 무조건 해야하는 명령어 -git remote add origin 깃허브주소 EX : git remote add origin https://github.com/jhs512/php_static_example 로컬 리포지터리를 원격 리포지터리 추가, origin 이라는 별칭으로 -git remote remove origin origin 이라는 별칭으로 추가된 원격 리포지터리와의 연결 제거 -git remote -v 현재 연결된 원격 리포지터리 리스팅 -git config user.name "깃허브아이디" EX : git config user.name "jhs512" 사용자정보(이름) 입력 -git config user.name 세팅된 사용자정보(이름) 확인 -git config user.email "깃허브에 가입할 때 사용한 이메일주소" EX : git config user.email "jangka512" 사용자정보(이메일) 입력 -git config user.email 세팅된 사용자정보(이메일) 확인 작업사항을 로컬 리포지터리에 넣는 명령어 -git status 작업폴더와 로컬리포지터리의 차이를 보여줍니다. 붉은색 파일은 장바구니에 담기기 전 상태 녹색 파일은 장바구니에 담긴 상태 -git add . 커밋 할 파일들을 장바구니에 담습니다. -git commit -m "커밋 메세지" -git log 현재까지의 커밋 내역을 보여준다. 나가는 명령어는 q -로컬 리포지터리를 원격 리포지터리에 업로드하는 명령어 - git push origin master --- # 2021-07-10,089일차(주말) ## [코딩] - xampp, composer, git 다운로드 - 깃허브 git bash 사용하여 업로드 해보기 --- # 2021-07-11,090일차(주말) ## [코딩] - 모작할것 찾기 - 깃허브 git bash 사용해서 업로드 --- # 2021-07-12,091일차 ## [코딩] - 닌텐도 모작 - 깃허브 commit 변경해서 올리기 --- # 2021-07-13,092일차 ## [코딩] - PHP기능이 있는 웹서버 켜기(이하 PHP웹서버) php -S localhost:8021 -t ./docs 켜기 8021은 포토번호로, 원하는 번호로 바꿔도 됩니다. - http://localhost:8021 PHP웹서버 접속 - Ctrl + C PHP웹서버 중지 --- # 2021-07-14,093일차 ## [코딩] - html vs php 비유: 편의점 vs 레스토랑 난이도: 쉽다 vs 복잡하다 실행환경: 단순 웹서버 vs php웹서버 활용도: 낮다 vs 높다 - 웹루트 디렉토리의 의미 : 웹 사이트의 시작 디렉토리 - 웹서버가 하는 일 : 웹클라이언트(브라우저)의 요청에 응대 - echo 를 하는 이유 : php 문법에서 html을 출력하는 쉬운 방법 --- # 2021-07-15,094일차 ## [코딩] - PHP 협업하는 방법 - 수정할 파일 다운로드 폴더생성 cmd git init git remote add origin https://github.com/내아이디/GITHUB파일이름 git pull origin master git config user.name "내아이디" git config user.email "내 이메일" ===================== 폴더생성 cmd git clone https://github.com/내아이디/GITHUB파일이름 git config user.name "내아이디" git config user.email "내 이메일" 두가지 방법으로 깃허브 파일을 끌어올 수 있음 - 협업을 할때는 항상 무조건 PULL부터 한다. 그래야 충동을 막을 수 있음. 충동이 생기면, 상대방과 연락후 수정해서 다시 올리기 --- # 2021-07-16,095일차 ## [코딩] - PHP SSG / css 불러올때 defer(나중에 실행) 써줘야 오류가 안남 - to2.kr/cUP 협업 연습 - git clone 으로 모든게 세팅된 로컬 저장소 한번에 만들기 -빈 폴더생성 -폴더접속 -cmd 이동 -git clone 저장소주소 . 꼭 . 을 붙여야 합니다. --- # 2021-07-17,096일차(주말) ## [코딩] - PHP 복습 - 일룸 앱 프로세스 페이지 작업 --- # 2021-07-18,097일차(주말) ## [코딩] - 일룸 앱 프로세스 페이지 작업 --- # 2021-07-19,098일차 ## [코딩] - 프로세스 페이지 발표 - 프로세스 코딩 섹션 나누기 & 작업 시작 --- # 2021-07-20,099일차 ## [코딩] - 일룸 앱 코딩 작업 끝 gsap 삽입, 영상 삽입, 이미지 삽입 - https://repl.it/ 가입 코드펜 처럼 사용 가능하고 php도 가능함 --- # 2021-07-21,100일차 ## [코딩] - to2.kr/cUN 토스트 8강 -repl 삽입 - repl사용이유 html, css, javascript, php 모두를 블로그에서 보여줄 수 있음 - 사용방법 New repl 버튼 클릭 > PHP Web Server 선택 후, Create repl버튼 클릭 내용 입력 후, 주소 복사하여 ```repl 복사한 주소 넣기 ``` - 개인 프로세스 페이지 작업 --- # 2021-07-22,101일차 ## [코딩] - PHP SSG 블로그, to2.kr/cSq, 36강 각 페이지가 다른 제목을 갖도록 - 개인 프로세스 페이지 작업 - GITHUB PAGE 만들 때 이미지,비디오 넣는 방법 : https://rawcdn.githack.com/[깃허브아이디]/[리포지터리]/master/[경로] 경로 = doc부터 쓰기 ex) https://rawcdn.githack.com/manyrice/repositary/master/docs/pf/work/resource/banner_1.png

--- # 2021-07-23,102일차 ## [코딩] - PHP SSG 블로그, to2.kr/cSq, 37강 각 페이지의 공통 네비게이션에 현재 페이지 표시 - 개인 프로세스 페이지 작업 끝 - var_dump( ); PHP에서 출력하는 방법 --- # 2021-07-24,103일차(주말) ## [코딩] - 일룸 앱 개인 프로세스 작업 - 일룸 앱 개인 코딩 --- # 2021-07-25,104일차(주말) ## [코딩] - 일룸 앱 개인 프로세스 작업 마무리 - 일룸 앱 개인 코딩 --- # 2021-07-26,105일차 ## [코딩] - 일룸 앱 개인 코딩 마무리 - 웹 기획 구상 - git 협업 작업하다가 저장했는데 올리고 싶지는 않을때 작업을 되돌리는 방법 git checkout -f docs/index.php 파일 열기 전 상태로 되돌려줌 - 배경 움직이게 https://codepen.io/jangka44/pen/wvdpPOB?editors=1000 --- # 2021-07-27,106일차 ## [코딩] - php 파일 sgg.php로 번경하는 방법 (ssg를 하는 이유는 php자체로 git에 올려서 사용할 수 없기 때문) to2.kr/cSq 42강 참고 --- # 2021-07-28,107일차 ## [코딩] - php 연습 현재시간 - 1.to2.kr/cWL - 개인 사이트 참고 페이지 1-1.https://emotionyun.com/portfolio/ - 2.https://github.com/webstoryboy/portfolio - [개인블로그참고1](https://webstoryboy.github.io/portfolio/port27/index4.html) 자기소개부분을 코드로 나타낸게 흥미로움 - [개인블로그참고2](https://webstoryboy.github.io/portfolio/port6/port05.html) 너무 귀여운 컴퓨터 화면의 포폴 - [개인블로그참고3](https://webstoryboy.github.io/portfolio/port24/index5.html) 페이지가 아래에서 위로 올라가는게 인상깊음 --- # 2021-07-29,108일차 ## [코딩] - fullpage참고 페이지 : https://to2.kr/cWU - masonry사용법 : to2.kr/cAC 88,89강 --- # 2021-07-30,109일차 ## [코딩] - [개인 포트폴리오 배경 원 움직이는 법](https://codepen.io/jangka44/pen/qBmYqKz) - to2.kr/chg 167.168강 애니메이션 floating 효과 - to2.kr/cNy 11강 스크롤 트리거 치트시트 - to2.kr/cNy 12강 position:sticky; --- # 2021-07-31,110일차(주말) ## [코딩] - 개인 블로그 조사 - 모작 사이트 찾기 - 모작 시작 --- # 2021-08-01,111일차(주말) ## [코딩] - 러쉬 홈페이지 상단바 모작 --- # 2021-08-02,112일차 ## [코딩] - to2.kr/cXf 최신 테일윈드 기능 - [개인 블로그 참고 페이지](https://to2.kr/cXm) - [이미지 다운](https://pravatar.cc/) --- # 2021-08-03,113일차 ## [코딩] - cNy 18강~20강까지 외우기 - 러쉬 모작하기 - 개인 블로그 자료수집... - fullpage 페이지 이동 수업 https://codepen.io/tldkwnstn/pen/abWjVgb - fullpage 공식 문서 옵션 https://github.com/alvarotrigo/fullPage.js/tree/master/lang/korean - to2.kr/cfy - https://to2.kr/ce9 정처기 정보 - 내일 할 일 - ssg여쭤보기 - 꼭 이걸써야 깃허브에 올릴 수 있는지, 깃에 왜올리지..?ㅋ 왜 docs에서 meta만 놔두는지 docs를 지우고 다시 생기는게 이해가 안됨/ - 모작 2차메뉴와 팝업 여쭤보기 - fullpage 꼭 site-wrap에 section 이어야 하는지 - 기능사 실기 js 주어지는건지? float,,, 외워요...?/플랙스로 써도됨 --- # 2021-08-04,114일차 ## [코딩] - 웹디자인 기능사 실기 수업 to2.kr/cX8 --- # 2021-08-05,115일차 ## [코딩] - cNy gsap 21강-23강 영상 올리기 - fullpage 10강 ~ 14강 - to2.kr/bFw 풀페이지 참고 페이지 --- # 2021-08-06,116일차 ## [코딩] - 스크롤바 커스텀 (맥북같이) - html에 이거 추가 - js에 이거 추가 $(function() { $("body").niceScroll(); }); - 웹 그라디언트: 색추천받음 - 나이스스크롤바 (테일윈드는 모바일 기준) - 꼭 2단으로 감싸기, js는 복붙 - php 깃허브에 올리는 법 복습하기 --- # 2021-08-07,117일차(주말) ## [코딩] - 개인 블로그 시안 만들기 --- # 2021-08-08,118일차(주말) ## [코딩] - 개인 블로그 시안 만들기 - 나이스 스크롤바 복습 - gsap 복습 --- # 2021-08-09,119일차 ## [코딩] - slog.gg 글 하나쓰기 - 유튜브 삽입 - 코드펜 삽입 - html, css 삽입 - 개인 포트폴리오 작업 하기 --- # 2021-08-10,120일차 ## [코딩] - 취업 특강 --- # 2021-08-11,121일차 ## [코딩] - 개인 포트폴리오 작업 및 발표 - 개인 포트폴리오 참고 페이지 찾기 - 블로그 글 쓰기 (모작했던것) - https://slog.gg/p/38 참고 - 21 08 11, IT일반, 본인 작업한 부분모작을 위켄을 이용해서, 블로그 글로 작성하는 방법 동영상 링크 https://youtu.be/ebS-W8K-rBg - 질문할 것 : images loaded 가뭐에요? --- # 2021-08-12,122일차 ## [코딩] - 위켄 모작 1번 이미지 변경 - 포트폴리오 수정 - 11일 질문 아직 못함 + 모작 2차메뉴와 팝업 여쭤보기 --- # 2021-08-13,123일차 ## [코딩] - slog.gg : gif는 어디서...? - 개인 포트폴리오 수정 --- # 2021-08-14,124일차(주말) ## [코딩] - 개인 포트폴리오 --- # 2021-08-15,125일차(주말) ## [코딩] - 개인 포트폴리오 --- # 2021-08-16,126일차 ## [코딩] - 포폴 컨펌 - 표지 글씨 크게 정적인 이미지로 - 마지막 페이지 다시 작업 - 자동 글써짐 애니메이션 - 참고 : https://codepen.io/tldkwnstn/pen/xxdeMpm --- # 2021-08-17,127일차 ## [코딩] - 개인 포트폴리오 작업 - 웹디자인 기능사 실기 공부 - [질문] 스르륵, 밑 팝업(? 버튼) 여쭤보기 formspree는 컨택 부분 html 쓰고 끝? images loaded 가뭐에요? 모작 2차메뉴 & 팝업 여쭤보기 --- # 2021-08-18,128일차 ## [코딩] - 개인 포트폴리오 작업 - 웹디자인 기능사 (select박스 만들기) - to2.kr/cAC 101강 참고 - 웹디자인 기능사 (2차메뉴 스르륵 참고) - 디자인 디테일 - 어떤 색을 써야하는지 - 지협적인 퀄리티 라던지 - 결론: 자잘한 것 물어보기 - 전체적인 구조는 바꾸지마. --- # 2021-08-19,129일차 ## [코딩] - 안녕하세요 글씨 효과 넣기 - https://codepen.io/jangka44/pen/QWvXXra --- # 2021-08-20,130일차 ## [코딩] - 포트폴리오 디자인 마무리&발표 - 위켄 글 작성 - [질문] 기능사 아코디언 스르륵, 세로 메뉴 여쭤보기 images loaded 가뭐에요? 모작 2차메뉴 & 팝업 여쭤보기 --- # 2021-08-21,131일차 ## [코딩] - 포트폴리오 디자인 수정 --- # 2021-08-22,132일차 ## [코딩] - 포트폴리오 디자인 수정 --- # 2021-08-23,133일차 ## [코딩] - 포트폴리오 디자인 수정 - 상단 메뉴 영문 호버시 한글로 교체하는 법 배우기 - [impress.js](https://to2.kr/c3T) --- # 2021-08-24,134일차 ## [코딩] - 위켄 작성 5번 아식스 까지 - [질문] 기능사 아코디언 스르륵, 세로 메뉴 여쭤보기 포트폴리오 디자인 컨펌 https://to2.kr/c38 이미지가 안움직여요 -images loaded 가뭐에요? 모작 2차메뉴 & 팝업 여쭤보기 - 마우스에 따라 이미지 움직이게 하기 - c37 js 랑 lodash 가져오기 - wiken 글 2개 쓰기 --- # 2021-08-25,135일차 ## [코딩] - 위켄 글 2개 쓰기 - [질문] 기능사 아코디언 스르륵, 세로 메뉴 여쭤보기 -images loaded 가뭐에요? 모작 2차메뉴 & 팝업 여쭤보기 - 마우스에 따라 이미지 움직이게 하기 - c37 js 랑 lodash 가져오기 --- # 2021-08-26,136일차 ## [코딩] - 포트폴리오 home 부분 코딩 --- # 2021-08-27,137일차 ## [코딩] - 웹 디자인 기능사 실기 연습 - 가로 페이지 2차메뉴 연습 + 팝업 + select 박스 --- # 2021-08-28,138일차 ## [코딩] - 웹 디자인 기능사 실기 연습 - 세로 페이지 2차메뉴 연습 + 탭메뉴 - 이미지 슬라이드 분석 --- # 2021-08-29,139일차 ## [코딩] - 웹 디자인 기능사 실기 연습 - 이미지 슬라이드 연습 - [질문] - select 박스 커스텀 글자만 왼쪽으로 보내기 - 모작 2차메뉴 & 팝업 여쭤보기 - flex a에 직접 못쓰는지 --- # 2021-08-30,140일차 ## [코딩] - [탭메뉴 커스텀](https://codepen.io/tldkwnstn/pen/dyRGPdq) --- # 2021-08-31,141일차 ## [코딩] - 웹디자인 기능사 실기 공부 --- # 2021-09-01,142일차 ## [코딩] - 웹디자인 기능사 실기 시험 --- # 2021-09-02,143일차 ## [코딩] - 포트폴리오 코딩하기 - 위캔 적기 - [글자에 그라데이션 넣기](https://codepen.io/jangka44/pen/mdwyNje) - 내 방식으로 위캔에 정리하기 - [글자에 쉐도우 주기](https://codepen.io/jangka44/pen/NWgPQOj) - [content 부분](https://codepen.io/jangka44/pen/ExXaqGG) - [퍼센트](https://codepen.io/jangka44/pen/XWgKWjo?editors=1100) - [질문] - 시험 확인서 제출 여쭤보기(제출) --- # 2021-09-03,144일차 ## [코딩] - 포트폴리오 코딩하기(경험 끝내기+포트폴리오시작) - 위캔적기 - 글자 그라데이션 위캔에 정리하기 --- # 2021-09-04,145일차(주말) ## [코딩] - 위캔 정리(포토샵, 일러스트 단축키 + CSS 단위) - 포트폴리오 경험 부분 --- # 2021-09-05,146일차(주말) ## [코딩] - 위캔 정리(--) - 포트폴리오 -- 부분 --- # 2021-09-06,147일차 ## [코딩] - [탑바 메뉴 칠하기](https://codepen.io/tldkwnstn/pen/oNwYjbQ) - [컨택트 부분](https://codepen.io/tldkwnstn/pen/VwWmvag) --- # 2021-09-07,148일차 ## [코딩] - 포트폴리오 수정하기 - 포트폴리오 합쳐 보기 --- # 2021-09-08,149일차 ## [코딩] - 오늘할일 - [포폴 전체적인 구조 설명](https://youtu.be/tzhKsvuWPYg) - [전체적인 구조 예시](https://codepen.io/jangka44/pen/ZEyLyay) - [컨텍트 부분 버튼](https://codepen.io/jangka44/pen/WNOREqK) --- # 2021-09-09,150일차 ## [코딩] - 포트폴리오 풀페이지 최종 라이브러리로 바꾸기 - [질문] - [6-1차시도: 포트폴리오1(라이트박스 적용-1)](https://codepen.io/tldkwnstn/pen/mdwWobx) - 중앙배치 되나요? - 섹션4 높이 배경이미지 높이지정 해줘도 되나요 - [5-1차시도: 포트폴리오 따로](https://codepen.io/tldkwnstn/pen/RwgpaYx) - 왜 자꾸 스크롤이 생기는거죠? - 넣지않은 클래스가 왜..? - [1차시도: 탑바](https://codepen.io/tldkwnstn/pen/bGRqNxo) - 웹 부분 탑바 안눌림 --- # 2021-09-10,151일차 ## [디자인] - 웹 사이트 리뉴얼 컨셉, 기업 정해오기 - 할일 : 자료찾기 ## [코딩] - 포트폴리오 수정 완료 - 할일 : vs 코드로 옮기기 --- # 2021-09-11,152일차(주말) - 포트폴리오 오류로 VS코드에 못옮김 - 웹 사이트 리뉴얼 자료찾기 --- # 2021-09-12,153일차(주말) - 웹 사이트 리뉴얼 자료찾기 --- # 2021-09-13,154일차 - 웹 사이트 리뉴얼 사이트 찾기, 자료찾기 - 포트폴리오 오류 해결,,, section 안에 section을 두면 안되는데 눈치없이 section이 들어가 있었다..ㅎ 어쨌든 해결.. --- # 2021-09-14,155일차 - 웹 사이트 리뉴얼 컨펌 자료찾고 디자인 조금하기, 카피할 사이트 발견 하지만 왜 카피할건지 이유 적어두기 - 포폴 사이트 vs로 넘어옴 --- # 2021-09-15,156일차 - 웹 사이트 리뉴얼 컨펌 - vs코드로 넘어와서 이미지 주소 변경하기 - 라이브서버에서는 잘나오는데 깃허브에 올린건 안나오는 이유 여쭤보기 - 스와이퍼 적용방법 알아내기,,, - 포폴 버튼에 호버시 색 바뀌는것 여쭤보기 --- # 2021-09-16,157일차 - 웹 리뉴얼 피그마 - https://to2.kr/c8R - section-4 버튼 밑줄 하기 - https://to2.kr/cAF - 포폴 발표 --- # 2021-09-17,158일차 - 웹 리뉴얼 디자인 - 포폴 수정하기 --- # 2021-09-18,159일차(주말) - 웹 리뉴얼 디자인 --- # 2021-09-19,160일차(주말) - 웹 리뉴얼 디자인 --- # 2021-09-20,160일차(주말) --- # 2021-09-21,161일차(추석) --- # 2021-09-22,162일차(추석) --- # 2021-09-23,163일차 - 백신 2차 --- # 2021-09-24,164일차 - 웹 리뉴얼 디자인/ 서브페이지 어느정도 마무리 하기 - [포트폴리오 부분 밑줄 색 변경](https://codepen.io/jangka44/pen/QWgOeJR) --- # 2021-09-25,165일차(주말) - 웹디자인 리뉴얼 마무리 --- # 2021-09-26,166일차(주말) - 웹디자인 리뉴얼 마무리 --- # 2021-09-27,167일차 - 웹디자인 리뉴얼 발표 - 기본적인 컨셉으로 하나 더 만들기 --- # 2021-09-28,168일차 - 기본적인 컨셉으로 하나 더 만들기 / 웹사이트 리뉴얼 --- # 2021-09-29,169일차 - 이미지로 팝업하는거 여쭤보기 - 도메인 포폴 사이트와 연결하기 - 작업물리스트 작성하기 - 웹사이트 리뉴얼1 코딩하기 - 웹사이트 리뉴얼2 메인 시작하기 - [포트폴리오 부분 밑줄 색 변경](https://codepen.io/jangka44/pen/QWgOeJR) - [작업물리스트](https://codepen.io/tldkwnstn/pen/eYRxgLK) --- # 2021-09-30,170일차 - 이미지로 팝업하는거 여쭤보기: 이미지맵 - 웹사이트 리뉴얼1 코딩하기 / 탑바 - [코딩 전 레이아웃](https://codepen.io/jangka44/pen/BaZbjWZ) - 웹사이트 리뉴얼2 메인 배너 넣기 - 포트폴리오 section-5 부분에 이미지 추가하기 - [포트폴리오 부분 밑줄 색 변경](https://codepen.io/jangka44/pen/QWgOeJR) --- # 2021-10-01,171일차 - 웹사이트 리뉴얼1 코딩하기 --- # 2021-10-02,172일차(주말) - 웹사이트 리뉴얼1 코딩하기 --- # 2021-10-03,173일차(주말) - 웹 사이트 리뉴얼1 메인 슬라이드 다시 여쭤보기 --- # 2021-10-04,174일차 - [웹 사이트 리뉴얼1](https://codepen.io/jangka44/pen/XWgwqra) - [카테고릴 분류 디자인 코딩](https://codepen.io/jangka44/pen/ExNYNez) --- # 2021-10-05,175일차 - 웹 사이트 리뉴얼1 코딩 - 내일 발표 준비 - 포트폴리오 조금 수정하기 --- # 2021-10-06,176일차 - 종강 - 개근상 수상 - 학업우수상 수상 - 수료증 - 언제다시 이렇게 즐겁게 무언가를 배울 수 있을까. - 많은 감정이 교차하는 날이다. - 강사님같은 상사 만날 수 있길ㅎ - 우리반 같은 팀원들 만날 수 있길! - 건강하고 행복하고 성공하길!