본문 바로가기

STUDY10

[개발폐관수련] 1.필기(window.onload, 콜백지옥, 디폴트 파라미터, 스프레드 연산자, 함수 파라미터) 개발폐관수련 1일 차. 합합! 스승 : ㅅㅈ 필기 시작. 1. window.onload window.onload = () => {}// 기존 function 문법window.onload = function() { console.log('페이지 로드 완료');};// ES6 화살표 함수 문법window.onload = () => { console.log('페이지 로드 완료');}; es6 문법으로 웹 페이지가 완전히 로드된 후에 특정 함수를 실행하도록 한다.jQuery의 $(document).ready() 와 비슷한 역할이라고 보면 된다. (차이점 ↓)$(document).ready() 는 HTML 문서 구조만 준비되면 실행된다. (외부 리소스, 스타일, 이미지 등 로드되지 않아도 실행)window.o.. 2024. 11. 26.
프론트엔드 개발 취업 아카데미 [20,21차] 필기 / 슬라이드 UI 개발 이번 주부터 본격적으로 자바스크립트 UI 개발 수업이 시작되었다. 스타트는 이미지 슬라이드 UI! 아 진심으로 죽을 맛이다! 너무 어렵다! 하하하! 선생님께서 슬라이드 UI 코드가 정말 익숙해지도록 매일 아침마다 타이핑시킬 거라고 하셨다. 슬라이드 UI 개발 코드는 스텝을 밟을수록 점점 간결해지고 단순해지는 대신 더 많은 기능을 가지게 되었다. 선생님께서는 이 최종 코드를 얻기까지 아주 오랜 시간 시행착오를 겪었다고.. 우리는 날름 받아먹는 거니까 감사한 마음으로 머릿속에 처넣도록 해야겠다. 학원 사람들과 같이 팀 프로젝트를 진행하기로 했다. 다양한 의견을 주고받는 과정이 재미있었고, 벌써 작업물이 기대 되잖아!!! 재미있게 해보고 싶다. [프론트엔드개발 20, 21차 필기] 번뜩할 때마다 필기를 한 .. 2022. 2. 22.
프론트엔드 개발 취업 아카데미 [18차] 필기 / 제이쿼리 jQuery! 하루만에 이론 수업 끝 나도 이젠 바닐라 자바스크립트만을 사용하는 멋진 개발자가 될꺼야! 는 치기일까. 오늘 하루 만에 제이쿼리 수업이 마무리되었다. 진짜 실무에서 사용하는 명령어와 문법을 짚어주셨다. 아.. 아무래도 제이쿼리와 헤어지기는 어려울 것 같다. 사용하기에 간편하고 호환성도 좋고. 따지고 보면 ㅁ..뭐 얼마나 무겁다고 그러는지! 제이쿼리를 떠나보내려고 바닐라 JS와 친해지려고 노력하는 중인데 오늘 선생님의 수업은 마치.. 아 선생님이 그냥 제이쿼리 본사에서 나온 영업 사원인가 싶었다. 그 길던 스크립트 문장을 이렇게 짧게 간단하게 작성할수 있어요 여러분~. 아직까지 제이쿼리로 구축된 웹사이트가 대부분일 것이고 유지보수 및 운영을 위해서 배워야 하는 건 맞는 거니까 ^^! 내일은 이력서 코칭받는 날이고, 다음 주부터 .. 2022. 2. 17.
프론트엔드 개발 취업 아카데미 [16, 17차] 필기 / 드디어 자바스크립트! 드디어 기다려왔던 자바스크립트, UI 개발 강의가 시작되었다! 완전 기초 이론수업은 건너뛰고 바로 코드를 작성했다. 수업 시작하자마자 여러 가지 방법으로 구구단을 만들었다. 아 진심으로 바보가 된 기분이었다. 머리로는, 말로는 어떻게 해야겠다고 감은 잡혔지만. 도저히 스크립트로 구현하기가 어려운 것이다. 선생님이 돌아다니시며 진행도를 확인하는데 노트북 화면을 숨기고 싶었다. 이것저것 작성해보고 구글 서칭도 해봤지만 해결이 안 된 부분이 있었다. 아무튼 혼자 작성하는 시간을 종료하고 선생님의 코드를 확인하는데 '아 내가 하려고 했던 게 저건대!'라는 내적 소리침. 아 왜 머릿속으로는 알겠는데 정작 스크립트로 작성이 안 되는지. 그건 아마도 내가 코어 스크립트를 제대로 이해하지 못하고 있기 때문인 것 같다... 2022. 2. 15.
프론트엔드 개발 취업 아카데미 [14차] 필기 / 웹접근성 설 연휴 동안 JS 입문, 중급 강의만 계속 들었다. 조금씩의 차이는 있지만 강의 내용이 거의 겹친다. 비슷한 내용을 여러 번 보다 보니 감이 잡히는 느낌이다. 자바스크립트와 친해지고 싶다. 진짜 잘하고 싶다. 지금은 거리감 느껴지는 언어지만 나중에는 제일 능숙하게 다룰 수 있는 언어가 되기를 진심으로 바란다. 빨리 성장하고 싶다. 하지만 한 스텝 한 스텝 밟으며 기본기를 탄탄하게 다져가며 성장하는 게 맞는 것 같다. 학원에서 드디어 UI 개발 과정에 접어들었다! 제일 기다리던 부분. 한편으로는 두렵지만! 최선을 다해 머릿속에 집어넣자. 기대된다! 재밌는 프로젝트에 많이 도전해보고 싶다.[프론트엔드개발 아카데미 14차 필기](강의를 듣는 중간중간 번뜩일 때만 필기를 하는 관계로 내용에 맥락이 없어 보입니.. 2022. 2. 11.
프론트엔드 개발 취업 아카데미 [8, 9차] 필기 / 기아자동차 클론 코딩 반응형(HTML / CSS) 벌써 프론트엔드개발 아카데미 과정 3주차다. 수업시간에 최대한 집중하고 있고(커피 안 마시면 나가리 되지만), 학원과 청년랩, 카페에서 혼공도 하고 있고. 그러다가 불안해졌다. 이렇게 공부하는게 맞나? 학원 과정은 강사님을 믿고 따라가면 되지만, 혼자서 공부할 때는 어떻게 해야 아깝지 않게 시간을 보낼 수 있는지 모르겠다. 일단 내 재생목록에 담아둔 인강들은 많이 있고, 미니 프로젝트도 만들어야 하고, 포폴에 넣을 클론사이트 작업도 해야 하는데. 게다가 지금은 자바스크립트에 집중하느라 리액트에는 아직 발도 못 담갔다. 혼자 곰곰이 고민하다가 '프론트엔드개발 공부를 도와 줄 사람을 구해볼까' 라는 생각이 번뜩였다. 어떻게 구해야 하지 눈알을 굴리다가. 당근마켓이 떠올랐다. 당근마켓에는 없는게 없으니까!. .. 2022. 1. 25.
프론트엔드 개발 취업 아카데미 [6차] 스벅 클론코딩 드디어 끝?! 오늘은 평소보다 15분을 더 자고 일어나, 수업시간 10분 전에 도착했다. 또 커피를 준비하지 못했다. 무조건 마셔야만 했는데.. 오늘로 스벅 홈페이지 마크업, CSS 클론 코딩이 마무리되었다. 웹 접근성에 맞게 작성하는 것.. 생각보다 쉽지 않다. '구조와 의미를 페이지에 담자. 주석을 사용해 코드를 보기 편하게 정리하자. 클래스를 남발하지 말고 공통되는 스타일을 찾아 모듈화 하자' 계속 생각하기. 점심은 컵라면과 삼각김밥. 음료는 테이크얼라이브블러드오렌지뭐시기. 내일은 꼭 커피를 준비해오자.[프론트엔드개발 아카데미 6차 강의 필기] 페이지의 파일명 룰을 정할 때 대메뉴-소메뉴 이름을 참고한다. 반드시 관련지어 정한다.페이지마다 body의 클래스이름을 각각 짓는다. 메뉴 이름을 포함한다.title을 정.. 2022. 1. 19.
프론트엔드 개발 취업 아카데미 [5차] 8시에 기상하여 30분 전 학원에 도착했다. 경건한 마음으로 수업을 들었다. 점심은 빽다방에서 사온 빵2개. 초코소라빵, 치아바타. 초코소라빵은 초코크림이 정말 많이 들어있었는데 대체 어떻게 먹어야 하는건지.. 손에 다 묻고 옷에도 묻혀버렸다. 초코소라빵은 집에서 먹는 것으로 하자. 커피는 마시지 않았다. 바보 같은 선택이었다. 커피는 빨간 포션이라고. 먹지 않으면 죽는거야. [수업 5차 필기] - 헤더에 들어가는 플로팅 팝업 위치 잡을 때!#top-ad {position: absolute; right: -150px; top: calc(100% + 30px);}(탑 높이에서 30px 떨어지게 위치함. 헤더의 높이가 바뀌어도 수정할 필요 없다ㅏ) - 컨텐츠영역은 (특히 header) 딱 떨어지는 숫자로 .. 2022. 1. 18.
프론트엔드 개발 취업 아카데미 [4차] 스타벅스 클론코딩/웹접근성/의미있는 파일명 오늘은 30분 일찍 학원에 도착했다. 오는 길에 빽다방 커피를 한 잔 사들고 노션에 작성 해 둔 이번 주 계획표를 다시 확인했다. 오전 강의시간에 스타벅스 홈페이지 메인 클론 코딩을 시작했다. 무심코 지나칠 수 있는 부분들을 강사님께서 정확하고 확실하게 짚어주셨다. 이전에 퍼블리싱을 하며 고려하지 않았던 웹 접근성 부분을 특히 강조하셨다. 아카데미 과정을 수료하고 나면 마냥 쉽게만 생각했던 마크업 작업부터 크게 달라질 것 같다. 마크업을 작성할때 의미와 구조를 항상 생각하자.시멘틱 태그의 heading태그에는 콘텐츠 영역을 안내하는 문구를 넣자.박스를 그릴 때는 디자인 위주가 아니라 콘텐츠 위주로 그리도록 하자.이미지에 대문자, 소문자 그대로 속성 값 alt에 넣도록 하자.콘텐츠의 작성 순서는 모바일 .. 2022. 1. 17.

티스토리툴바