개발자 공부합니다

[수업 목표] 파이썬 기초 문법을 익히고, 여러가지 퀴즈로 빠르게 숙달한다. 파이썬 심화 문법들을 다뤄봅니다. 머릿속 어딘가에 담아두고, 나중에 생각나면 써먹기! ✅ 리스트, 딕셔너리 result3 로 a_list.sort() 로 나열해보려고 했는데 None이 뜬다. 왜일까? 아래의 그림처럼 result3 가 다시 프린트 되는 것이 아니라 이미 a_list 가 수정이 되기 때문에 제대로 출력되지 않는 것.! a_list.sort(reverse=True) 는 역순으로 차례대로 나열하라는 뜻이다. 5가 a_list 에 있으면 True 없으면 False 가 나타난다. 딕셔너리 안에 리스트를 넣을 수 있다. 딕셔너리에 추가하려면 a_dict['이름'] = 수지 라고 넣으면 다시 출력했을 때 추가되는 것을 볼 수..

[수업 목표] 파이썬 기초 문법을 익히고, 여러가지 퀴즈로 빠르게 숙달한다. 파이썬 심화 문법들을 다뤄봅니다. 머릿속 어딘가에 담아두고, 나중에 생각나면 써먹기! 1. 파이썬 시작하기 파이썬이란? 일종의 번역팩을 설치한다고 생각하면 됩니다. 컴퓨터는 101010001 과 같은 언어만 알아듣는다고 했지요? 파이썬 문법으로 된 것을 101010001로 변환해줄 수 있도록, 번역 패키지를 설치하는 것입니다. '읽기 쉽게' 만든 언어이기 때문에, 문법이 쉬워 초보자가 배우기 좋은 언어입니다. 바탕화면에 sparta_python 폴더를 만들어줍니다. 파이참 실행! Create New Project 를 선택해주세요. 아래와 같은 화면으로 만들어주기! 주의! base interpreter - 파이썬 버전이 3.8로 ..

[수업 목표] 파이썬 기초 문법을 안다. 원하는 페이지를 스크래핑할 수 있다. Flask를 통해 웹 개발의 전반적인 그림을 이해할 수 있다. 01. 파이썬 시작하기 ✅ 파이썬은 인터프리터식, 고수준 프로그래밍 언어입니다. 다양한 분야에서 활용되며, 개발자와 학습자 모두에게 인기가 있습니다. 간결하고 읽기 쉬운 문법을 가지고 있습니다. ✅ 파이썬을 사용하는 의미 프로그래밍은 컴퓨터에게 일을 시키는 행위로 파이썬 문법으로 된 것을 101001로 변환해줄 수 있도록, 번역 패키지를 설치하는 것입니다 파이썬은 번역 기능을 다듬어서 계속 좋은 번역을 할 수 있도록 새 버전을 출시해준다. 지금까지 우리는 화면에 웹을 그려주는 도구들을 배워봤습니다 HTML, CSS, Javascript, jQuery 등을 사용했죠!..

✅ 위의 사진처럼 실시간 서울 날씨를 API 적용해보자. 1. 먼저 데일리모토 날씨 fetch 골격을 만든다. let weather_url = "http://spartacodingclub.shop/sparta_api/weather/seoul"; fetch(weather_url) .then(res => res.json()) .then(data => { console.log(data); }) 2. body 안의 이름도 바꾸어준다. 여기서 id일때에만 #을 사용하기 때문에 img에는 그냥 ' ' 를 쓴다. 이렇게 위에 날씨부분이 바뀐것을 볼 수 있다. DOCTYPE html> Document body { background-image: url("https://s3.ap-northeast-2.amazonaws...

[수업 목표] Javascript의 사용방식에 대해 이해하고 문법에 익숙해진다 JQuery로 HTML을 조작할 수 있다 Fetch로 서버 API에 데이터를 주고, 결과를 받아온다 07. [데일리모토] 시간 기능 구현하기 1) 코드스니펫 ChatGPT (https://chat.openai.com/auth/login) 를 실행해보자. 📌 ChatGPT 다양한 활용 코드 작성 도움: chatGPT는 코드 작성에 대한 도움을 받을 수 있어요! 원하는 프로그래밍 언어나 기술에 관련된 코드를 물어보면, 해당 코드를 작성하는 방법과 문제 해결에 도움이 되는 팁을 받을 수 있답니다. 개념 이해와 설명: chatGPT는 개념적인 질문에 대해서도 답변도 받을 수 있어요. 프로그래밍 개념, 알고리즘, 데이터 구조 등에 대한..

[수업 목표] Javascript의 사용방식에 대해 이해하고 문법에 익숙해진다 JQuery로 HTML을 조작할 수 있다 Fetch로 서버 API에 데이터를 주고, 결과를 받아온다 1. JavaScript JS는 데이터를 받아서 화면을 바꾼다. 움직이는 화면을 만들 수 있다. html은 뼈대, css는 꾸미기, JavaScript는 움직이기! 날씨가 실시간으로 변하거나 시간이 실시간으로 움직이고 새로 고침을 했을 때 명언이 그때 그때 바뀌는 것을 할 수 있다. 프로그래밍 언어는 기계와 사람이 소통하기 위해 만든 언어입니다 1) JS 코드 실행법 + Console.log 사용 JavaScript 코드는 브라우저 → 개발자 도구 콘솔창에서 실행할 수 있어요. 모든 브라우저에는 JavaScript 코드를 실행할..

위 사진처럼 수정해서 만들어 보자. 1. navbar 를 수정해준다. 2. 메인에서 한글로 바꾸어주고 멜로디쉐어 밑에 공백을 pb-5로 준다. 3. card 내용을 바꾸어준다. Doctype html> Bootstrap demo @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css"); .background-banner { background-image: linear-gradient(45deg, rgb(51 43 43 / 75%), rgb(20 19 20 / 61%)), url("https://s3.ap-northeast-2.amazonaws.com/materials.spartacodingclub...

[수업 목표] 웹 브라우저의 기본 원리에 대해서 이해한다 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) 웹의 동작 개념..