[수업 목표] 웹 브라우저의 기본 원리에 대해서 이해한다 HTML, CSS의 기초 지식을 이해하고 뼈대를 생성할 수 있다 부트스트랩을 활용하여 웹을 다양하게 구현할 수 있다 3. 멜로디쉐어 만들기 위 그림의 완성본을 만들어보자. 1. 부트스트랩 기본 코드를 복사 붙여 넣기 한다. Hello, world! ✅ navbar 를 만든다. navbar를 추가한다. 부트스트랩-navbar-color schemes-검정색 navbar 선택 -> nav의 코드를 추가한다. Doctype html> Bootstrap demo Navbar Home Features Pricing Disabled 16번째 라인의 Navbar 를 삭제해주면 navbar 의 아이콘을 제외한나머지 4개의 아이콘으로 완성. 13 라인의 최 상단의..
[수업 목표] 웹 브라우저의 기본 원리에 대해서 이해한다 HTML, CSS의 기초 지식을 이해하고 뼈대를 생성할 수 있다 부트스트랩을 활용하여 웹을 다양하게 구현할 수 있다 1. 데일리모토 프로젝트 설명 ✅ 웹페이지 구조 1) 네비게이션바 (navbar) : 홈페이지 상단에 위치하며 주로 메뉴 항목이 포함되어 있다. 사용자가 웹사이트 내에서 이동하고자 하는 다른 페이지로 연결되어 있다. 본문 (main) : 주요 컨텐츠가 포함되는 영역. 웹사이트의 내용이 위치하며 텍스트, 이미지, 동영상 등 다양한 형태의 정보가 포함되어 있다. 푸터 (footer) : 홈페이지 하단에 위치하고 추가정보와 부가적인 링크를 포함한다. 연락처 정보, 저작권 정보, 개인정보 처리 방침 등이 이에 포함된다. ✅ 프로젝트 환경 설..
[수업 목표] 웹 브라우저의 기본 원리에 대해서 이해한다 HTML, CSS의 기초 지식을 이해하고 뼈대를 생성할 수 있다 부트스트랩을 활용하여 웹을 다양하게 구현할 수 있다 1. 웹 브라우저의 기본 원리 1) 구글 검색 결과를 해킹해보자! ✅ 구글로 접속한 뒤 귀여움이라고 검색 구글에서 귀여움을 검색하면, 오른쪽에 귀여움이 무엇인지 설명이 나오는데 귀여움의 설명을 한번 바꿔보자 설명 부분(파란색 사각형)에 마우스 오른쪽 클릭을 눌러 검사 탭을 열자. ✅ 오른쪽에 뜨는 것은 개발자 도구. 개발자 도구에서 마우스를 올렸을 때 설명이 색칠되는 부분을 더블클릭하고 내용을 바꿔쓰고 엔터를 눌러보자. 내용에 '어떤것'을 추가하면 바로 바뀌는 것을 볼 수 있다. 귀여움의 정의에 '어떤것'을 추가 2) 웹의 동작 개념..
웹개발 용어 정리 2 ✅ 중학생도 알아들을 수 있게 쉽게 정리해보세요! 데이터베이스(Database) : 여러 사람에 의해 공유되어 사용될 목적으로 통합하여 관리되는 데이터의 집합을 말한다. 자료항목의 중복을 없애고 자료를 구조화하여 저장함으로써 자료 검색과 갱신의 효율을 높인다. 관계형 데이터베이스(Relational DataBase) : 데이터를 계층 구조가 아닌 단순한 표(릴레이션;관계)로 표현하는 형식의 데이터베이스. 표(table)로 자유롭게 가로세로의 항복을 액세스할 수 있도록 되어있다. 쿼리(Query) : 질문, 질의(inquiry)와 같은 뜻으로 사용된다. 파일의 내용 등을 알기 위해 몇 개의 코드(code)나 키(key)를 기초로 질의하는 것을 가리킨다. 데이터 베이스에 존재하는 자료를..
웹개발자 JD 분석 📖 Python 기반 웹개발자 직무의 JD 분석을 통해 웹개발자는 어떤 일을 하는 사람이며, 어떤 핵심 역량을 갖춰야 하는지 이해한다. JD(Job Description) 분석이란? JD란 현재 채용 중인 포지션이 어떤 일을 하는지 자세히 설명해놓은, 쉽게 말해 ‘채용 공고’를 일컫습니다. 기업이 현재 원하는 사람에 대해 자세하게 작성되어 있는 채용 정보를 보면 아래와 같은 내용들을 분석해 볼 수 있겠죠? 나 스스로가 이 기업과/직무에 맞는 사람인지 이에 맞춰서 나의 어떤 점을 강조하여 지원할 수 있을지 (참고) 기업이 채용을 잘 하기 위한 JD 작성 9단계 [채용 따라하기 #1] 채용에 성공하는 채용 정보(Job Description, JD) 작성 9단계 - 로켓펀치 공식 블로그 웹..