열심히 끝까지

[10분 테코톡] 웹 접근성 & 표준 - 미키 https://www.youtube.com/watch?v=xToJhmAJYCE 1. 웹 표준 1-1. 웹 표준이 등장한 배경 시간 흐름 : 초기 -> 중기 -> 말기 초기 : 넷스케이프 vs 인터넷 익스플로러 - why? 웹을 장악하기 위해! > 이 때, 개발자 = 고래 싸움에 등 터진 새우 why? 넷스케이프와 인터넷 익스플로러, 두 가지 버전의 페이지를 모두 개발했어야 하기 때문 중기 : 윈도우98이 인터넷 익스플로러 기본 탑재 시작(넷스케이프 하락세), IE가 독점, IE는 자사에 유리한 플러그인을 대거 채용 > 호완성 고려X ex ) Active X 말기 : 스마트폰의 등장 > 특정 OS나 특정 브라우저에서만 동작하는 웹페이지의 자리는 사라짐, 웹 표..

[10분 테코톡] 정규 표현식 - 빙봉 https://www.youtube.com/watch?v=CjoDIgDOHA4&t=3s 1. 정규표현식의 이해 - 정규표현식(규식) : 1951년도 제작 : 수학자 Stephen Cole Kleene에 의해 제작 > 초기에는 수학적인 개념으로 탄생 >> 사용되게 된 순서 1. 편집기의 패턴 매칭을 시작으로 사용 2. grep 명령어가 정규표현식을 사용 -> 발전 시작 3. vi, emacs 같은 편집기나 sed, awk같은 유닉스 명령어에도 정규표현식 추가 4. 이후 IDE와 여러 프로그래밍 언어의 표준 라이브러리로 지정 >> 능력 - 특정 패턴을 가지고 문자열을 찾을 수 있음 ex ) 전화번호 유효성 검증 요구사항 1. 맨 앞의 번호는 010으로 시작 2. 대시(..

--애니메이션 효과(hover시 늘어나는 바) 쇼핑몰 메뉴 신상품 인기 상품 30 타임세일!!! 고객센터 >> 상태변화에 따라 값이 변화는 것 --개인 애니메이션 제작 애니메이션 >> 내가 직접 만들어서 사용하는 것 ----웹 폰트 구글 웹 폰트 https://fonts.google.com/ 한국어 사이트를 만들고 싶으면 폰트에 한국을 골라서 폰트를 고를 것 티가 많이 나는 폰트 설정 아래 select 버튼 클릭 오른쪽에 링크 뜸 복사해서 링크 복사 >> 준비 끝!!!! 가나다라마바사 아자차카타파하 >> 실무에서는 웹폰트는 css 파트라 import로 많이 쓴다. 하지만 우리는 마음에 안들어서 바꾸는 것이기 때문에 가져와서 쓴 것

- 이마트 웹페이지에 대한 분석 >> 크롤링하는 방법은 생각보다 어려웠습니다. 1. 이마트의 제품 이름 제품 이름을 출력하기 위해 개발자도구를 이용해 제품이름을 주는 지정자를 찾았습니다. 하지만 긁어와서 출력했을 때는 제가 원하는 제품이름을 제외한 이름, "이마트몰", "E-MART FRESH", "No Brand"와 같은 이름들도 출력되기 시작했습니다. 이 문제를 해결하기 위해 제가 원하는 값을 가지는 지정자의 위를 거슬러 올라가 그 값이 지니는 li.class의 이름을 가져와 출력했습니다. 그러자 제가 원하는 제품 이름 값을 가져올 수 있게 되었습니다. 2. 이마트의 가격 가격도 제품과 마찬가지였습니다. 현재 팔고 있는 가격 포함 할인되기 전 가격도 출력하는 바람에 수박의 가격이 다음과 같이 저장되는..

내 방법------------- 옷가게 서브clothes 다음과 같은 상품들이 존재합니다. 가방 6000 장갑 5000 목도리 4000 모자 5000 강사님 방법------------------------- 제목 소제목 다음과 같은 상품들이 존재합니다. 결명자차 3000원 아메리카노 2300원 프라푸치노 5600원

[어제 내용] HTML 마무리 - 시맨틱 태그 >> 태그가 일정한 의미를 가질 수 있게끔 코딩하는 것(페이지 기술) >> 어떤 기능을 하는지 한 눈에 보이게 구성하는 것(페이지 리더가 읽을 수 있게) >> 박스 태그 사용해서 - 웹 탬플릿 [오늘 내용] 로고, 광고(사진), 기사 >> 이 중에서 제일 중요도가 높은 것은? 1. 로고 2. 광고(사진) 3. 기사 >> 헤더 - 로고 세션 - 광고, 기사 이때, 묶이는 것들은 로 묶을 것 로고 제작 >> 헤더 지정 - 이때, id를 헤더로 지정한다고 상단에 배치되는 것은 아님 > 코드 상 위치가 아래더라도 #header를 맨 위로 올리는 css 적용하면 올라가게 됨 NAVER 광고 기본 틀 기사 >> 로렘입숨(더미데이터) 사용 Lorem ipsum dolor..

[오늘 수업] 시맨틱 태그 : 중요도, 보조도구, 이용순서를 고려해서 작업 시맨틱(마크 업) 태그 > 웹 접근성 잘 할 것 ex ) div span header footer 작업을 할 때, >> [공지사항] 존재 + 더보기 1. 공지 7번 2. 공지 6번 3. 공지 5번 4. 공지 4번 5. 공지 3번 ... >> 요즘 공지부터 나열하는 것이 일반적 >> 최근 게시글이 위에 있도록 하는 것 타이틀 : 공지사항(태그) + 더보기 존재(더보기 버튼 누르면? 두개의 게시글이 보이게)(태그) + 최근 게시글이 상단에 존재(오더리스트) 공지사항 +더보기 공지 7번 공지 6번 공지 5번 >> 시맨틱 태그를 잘 지킨 것이 아니다!! >> 공지사항 바로 다음에 h2를 위치시키면 스크린 리더가 읽을 적에 공지사항, 더보..

[오늘 수업] -- 리스트 사과 바나나 키위 apple banana kiwi 상의 긴팔티 반팔티 하의 청바지 반바지 신발 운동화 슬리퍼 구두 -- 표 아이디 아이디를 입력하세요 비밀번호 비밀번호를 입력하세요 회원가입하기 로그인 버튼 교과목 점수 HTML 93 CSS 92 평균 92.5 다음 페이지 1 2 3 4 1 2 3 4 5 이전 페이지 -- 폼 아이디 : 비밀번호 : 이메일 : 개수 : 남 여 과목선택 C언어 JAVA JSP 전화번호 지역번호 02 031 032 055 --