▪︎학습한 내용 구글 애널리틱스를 활용하여 페이지 방문자 수 확인 Jacascript 실행방법 사이트 우클릭> Console Visual Studio Code 프로그래밍 언어? 시간순서에 따라 실행하는 특성을 가진 컴퓨터 언어 Javascript는 동적 페
방문할 때 마다 바뀌는 웹페이지 배경스타일 시트를 활용하면 일괄 변경이 가능사진이 계속 바뀌는 사이트사진 제공 사이트style.css 로 새 페이지를 생성index.html 페이지 head에 속한 style 값을 모두 style.css 페이지로 옮긴다.index.htm
함수는 배열이 필요하다.배열을 봉다리이다.모르는 건 Cheat Sheet 로 검색반복문 함수를 이용한 페이지 글자색 변경 코드함수 night는() {내용+반복문}document.querySelectorAll ➪ 반복문선언한다 as = 모든 'a' 선택반복해(선언 i=0
복습css 경우 html template 검색해보면기본적으로 디자인 되어 있는 것을 수정, 사용 가능01\. 설치 안해도 파이썬 실행할 수 있는 방법구글 드라이브에서 New 클릭>더보기>연결할 앱 더보기>Colaboratory 앱 검색 후 설치Colaboratory는온
유튜브 들어가서 마음에 드는 영상 클릭 후공유 버튼 클릭>퍼가기 클릭>태크복사>원하는 위치에 태그 삽입카카오맵 들어가서 원하는 위치 검색위치 클릭>공유 아이콘 클릭>HTML태그 복사 클릭>원하는 위치에 삽입\*카카오 지도의 경우 Open redrive server 로
Web과 Python은 서로 상관없이 각자 1990년 초 발전웹과 파이썬이 만나는 지점 flasckFlask개발환경 세팅이 까다롭다.웹페이지를 찍어내는 동작이다.상품과 제품의 차이? 상품: 상인들이 파는 것제품: 제조사들이 만든 것Flask 제품을 만드는 공장 같은 것
Flask프레임 워크라 부름라이브러리와 프레임워크의 차이함수가 있다. 함수를 우리가 호출하는가??아니다 우리는 정의만, 호출은 flask가 한다.약속에 맞게 함수를 만들어놓으면 호출 당하는 것.Flask에 사용되는 것을 프레임워크라고 부름서버를 데이터로 전송할 때 사용
🌱 학습한 내용 ✏️데이터베이스 만들기 Glitch에서 sever.py 페이지>터미널 클릭 sqlite3 입력 엔터 .open db sqlite3 입력 엔터(이제 모든 명령이 db.sqlite3에 저장된다) 표 만들기 ➪ CREAT TABLE topics ( 입력 i
과거에 비해 python 언어가 많이 좋아졌다.머신러닝과 딥러닝머신러닝은 충분히 가능한 과정.딥러닝은 공부가 필요하고 현 컴퓨터 환경에서 작동되지 않을 수 있다.깃깃허브에 대해 알아보기(필수 교양)녹색이 많다는 것 잔디관리라고 부린다. 무언갈 많이 했다는 뜻이다.자신의
🌱 웹 퍼블리셔 ✏️하는 일 HTML 마크업 CSS 스타일링 웹 표준성, 웹 접근성 간단한 J-Qurey JavaScript 과거 flash 를 이용했지만 아이폰이 플래시 지원을 하지 않게 되면서 JavaScript를 사용하기 시작함. 백엔드 개발자 중 JavaS
🌱 link ✏️link 태그 a 태그 href ➪ 링크의 목적지 target ➪ 창을 여는 형태 _self ➪ 열린 페이지 내 _black ➪ 새로운 페이지 id ➪ 중복 사용 불가능, 페이지 안에서 유일 ✏️Form form name ➪ 스크립트나 서버에서
🌱 학습한 내용 ✏️button 버튼 만들기 reset버튼 submit버튼 image버튼 input태그와 button태그를 같이 쓰는 이유 <input> <button> 왜 같이 쓰는가? button은 자식태그를 가질 수 있다. button은
🌱 CSS3 ✏️CSS규칙 스타일 상속: 부모 태그로부터 상속(자신을 둘러싼 태그 상속 Cascading: 위에서부터 흘러내려 다른 것들에게도 적용 캐스캐이딩 Overriding: 우선순위가 높은 것부터 적용 1. important: 얼마나 중요한가 2. S
🌱 Selector ✏️자주 사용되는 가상셀렉터 마우스 유형 :hover 마우스가 올라갈 때 사용 :active 마우스를 누른 상태에 적용 폼요소 :focus 포커스를 받을 때(키보드, 마우스 클릭)에 적용 링크 :link 방문하지 않은 링크에 적용 :visite
🌱 paragraph ✏️direction direction rtl 오른쪽부터 시작 direction ltr 왼쪽부터 시작 글 작성 방향 ✏️text-align text-align 문자 정렬 문단 정렬 ✏️text-indent text-indent 들여쓰
🌱 학습한 내용 ✏️boxshadow box-shadow 가로 | 세로 | 번짐 | 색 box-shadow 그림자 box-shadow: inset 내부그림자 boxshadow ✏️table border 굵기 | 선속성 | 색상 border-collapse 표
🌱 transition ✏️속도 곡선 transition: transform 2s ease-in 트랜지션 변형 2초로 ease in(느리게 시작) transform: scale(2) perspective(120px) rotateX(180deg) 변형 크기 2배로 3
🌱 position ✏️static position: static -기본값(설정하지 않아도 기본 적용) -2차원 속성 -> float 사용하면 위치 지정 가능 3가지 체크 사항 1) 부모 자식 간 마진 병합? 마진 병합 발생 2
🌱 반응형 장단점 ✏️반응형 장단점 장점 1) 모든 기기에서 접속 가능 2) 가로모드에 맞춰 레이아웃 변경 가능 3) 사이트 유지 관리 용이 4) 최신 웹 표준 따름 단점 1) 사이트 디자인 단순 2) 하위 버전 브라우저와 호환성 문제 있을 수 있음 -> 미디어쿼리
🌱 반응형 메뉴 2 ✏️nth-child/position position: fixed 위치 고정, 무조건 그자리 그대로 position: static 기본값, 변경된 포지션 속성을 기본값을 초기화할 때 사용 flex-direction: column flex 나열 방
🌱 full screen ✏️position background-position: x-position y-position 위치에 따른 값 left, center, right,% x축 사용 속성 right, center, bottom, % y축 사용 속성 > 사진이
🌱 2단 블로그 ✏️이어지는 내용 aside 목록 폼 popular-posts, footer 가로 최소 길이 600px 일 경우 🌱 Emmit ✏️Emmet 에밋으로 빠르게 코딩하기 html 코딩 텍스트 입력 후 탭키 p 태그이름 p.text 태그이름 +
🌱 부트스트랩 ✏️CSS 프레임워크 부트스트랩 > Quick Start 코드를 불러서 사용하는 방법 > 다운로드 후 오프라인으로 사용할 수 있는 방법이 있음. > 다양한 콘텐츠 제공, class에 설정된 css 속성값 대신 원하는 css 속성값을 재할당 시킬 수
🌱 강사 소개 강사: 김은지 현 마이크로소프트웨어 엔지니어 🌱 개발자가 되기까지 대학교 컴퓨터 공학과 진학 IT 분야 중 소프트웨어 개발에 관심이 생김 프로그래밍에 익숙해지는 것(도구사용, 디버깅, Computational Thinking) 시간이 필요 실력이 계
🌱 부트스트랩 layout1 ✏️layout1 bg-primary 배경색과 글자색을 동시에 적용하려면 text-white 흰색 텍스트 text-center 텍스트 정렬 센터 p-5 패딩 5px navbar 메뉴바 bg-dark 배경 어두운 색 navbar-dark
🌱 웹 서버 ✏️웹 서버 운영하기 Web Server 가 설치된 컴퓨터 Web Server SW HTTP 기반으로 클라이언트 요청을 받아 정적인 콘텐츠(html, jpeg, css)를 제공하는 컴퓨터 프로그램 동적인 콘텐츠 제공을 위한 요청 전달 ✏️WAS Web
🌱 워드프레스 글쓰기 ✏️글/페이지 글과 페이지? 제공되는 '글 유형'중 하나 시간으로 구분 글: post 최신날짜 기준 정렬(카테고리, 태그 지정 가능/rss 피드 가능) 페이지: page 사이트에 항상 표시되는 콘텐츠(계층구조) > 글 작성 메뉴에서 선택 후 작
🌱 테마 ✏️테마 변경 적용 무료 테마 검색 사이트 Wordpress >사이트 다운로드 후 파일질라에서 업로드하면 사용 가능 🌱 kboard 플러그인 ✏️파일 다운로드 후 설치 >플러그인 추가 설치에서 kboard 설치 후 활성화 추가적으로 설치된 kboard
🌱 웹 개발 ✏️개념 웹 개발은 웹 브라우저 화면에 보이는 모습과 사용자에게 제공할 기능, 서비스를 모두 담고 있는 것. >* 클라이언트* 사용자가 웹 사이트에 접근할 때 사용하는 기기 좁은 의미로는 웹 브라우저 >> 프런트엔드 개발 웹 브라우저 화면에 보이는 부분
🌱 문자열 ✏️ escape 문자열에 \n 을 삽입하면 줄바꿈 가능. ✏️ Template literals 문자열에 따옴표(', ") 대신 백틱을 사용하면, escape 문자를 사용하지 않아도, 입력한 그대로 문자열이 표현 ✏️ index > 문자열에서 inde
🌱 배열 ✏️기본 배열, 여러 자료들 묶어서 활용할 수 있는 자료들 > 배열 요소는 숫자형, 문자형, Boolean, 배열, 함수가 들어갈 수 있다. ✏️요소 추가 push 배열 안 마지막에 요소 추가 > push 할 경우 배열 마지막에 새로운 데이터를 삽입할
🌱 while ✏️while 조건문이 참일 때 실행되는 반복문. 문장안이 실행되기 전에 참, 거짓을 판단 > while 계속 증감하여 끊임 없이 반복함. > confirm 함수를 이용해 조건 부여 확인을 누를 경우 true 값 발생 실행문이 실행되고, 취소를 누를
🌱 함수 ✏️장점 각 명령 시작과 끝을 명확하게 구분 가능 함수에 이름을 붙일 경우 필요할 때마다 함수 실행 가능 ✏️선언 함수가 어떤 명령을 처리할지 알려주는 것 function 예약어를 사용, { } 안에 실행할 명령 작성 ✏️호출 함수 이름을 사용해 선언한
🌱 이벤트 ✏️이벤트 영역 > 하단 body 부분 ✏️이벤트 개념 웹 브라우저나 사용자가 행하는 동작 사용자가 웹 문서 영역을 벗어나 하는 동작은 이벤트 아님 ✏️이벤트 처리기 이벤트 발샐 시 어떤 함수 실행할지 알려줌 태그 안에서 이벤트 처리시 "on" + "
🌱 배열 ✏️Array 배열에 활용하는 속성과 함수가 미리 정의되어 있는 객체 ✏️실습 01 ✏️실습 02 Math.floor 소숫점 아래 버림 Math.random 0과 1 사이 랜덤 숫자 생성 > 새로고침 시 랜덤 명언 생성 확인 ✏️실습 03 > 1.
🌱 실습 ✏️01 > p 태그 클릭 시 글자색, 배경색 변경 확인 ✏️02 > 체크 버튼 클릭 시 회색 색상 변경 확인 🌱 form ✏️01 > 체크 박스 클릭 시 데이터 가져오기 확인 가능 ✏️02 ✏️03 ![](https://velog.velcd
마우스 스크롤 내릴 경우 아래 그림과 위 What I Do 영역이 분리되어 따로 스크롤이 적용되는 애니메이션 구현가능✏️ 어떻게 해결을 했는가?✏️ 이렇게 이해를 했다✏️ 어디까지 이해했지?✏️ 다음에 시도해볼 방법🌷 학습 소감
🌱 JQuery ✏️개발환경 구성 JDK 설치 이클립스 Apache tomcat 웹 브라우저 JDK 링크 tomcat 링크 [이클립스 링크](https://www.eclipse.org/downloads/download.php?file=/technology/epp
🌱 JQuery ✏️이클립스 자동완성 기능 추가하기 ✏️함수 JQuery 에서 가장 중요한 함수 $(객체)로 작성할 수도 있음 ✏️Ready 함수 JavaScript의 window.onload와 흡사 window.onload 태그 객체가 모두 생성되면 발생되는 이
🌱 Form ✏️FormSel1 ✏️FormSel2 🌱 이벤트 함수 ✏️EventSel1 > • click : 클릭 • Dblclick : 더블 클릭 • Mouseenter : 마우스 커서가 들어왔을 때 • Mouseleave : 마우스 커서가 나갔을 때 •
🌱 CSS ✏️CssClass > • jQuery는 태그의 css를 제어할 수 있는 함수를 제공 • addClass : css class를 설정 • removeClass : css class를 제거 • toggleClass : 지정된 클래스가 없으면 설정하고 있으면
🌱 React ✏️개념 프런트엔드 프레임워크 중 하나 리액트(React), 앵귤러(Angular), 뷰제이에스(Vue.js) ✏️장점 페이스 북 개발에 사용한 기술 공개 소프트웨어 화면 출력에 특화된 프레임워크 컴포넌트 조립하여 화면 구성 게임 엔진 원리 도입해
🌱 React ✏️개념 장점 페이스 개발에 사용한 기술 공개 소프트웨어 화면 출력에 특화된 프레임워크 컴포넌트를 조립하여 화면 구성 게임 엔진 원리를 도입하여 화면 출력 속도가 빠름(Virtual Dom) ✏️버튼 클릭 시 숫자 증가하기 state 사용 특성: 비
🌱 컨텍스트 ✏️개념 어떤 컴포넌트 트리 내에서 최상위 컴포넌트 부터 ✏️접근 방법 consumer useContext conTextType ✏️실습 프로젝트 생성 app.js components/Title.js components/Message.js co
🌱 Redux ✏️ 개념 -JavaScript 상태관리 라이브러리 Node.js 모듈 상태관리 툴 종류: React Context, Redux, Mobx ✏️ 상태관리 필요성 • 상태관리 React에서 State는 component 안에서 관리되는 것 • Comp
🌱 동기와 비동기 ✏️ 동기 작업(task)들이 순차적으로 이루어 지는 것 다른 작업들을 blocking ✏️ 비동기 잡업(task)들이 순차적으로 이루어지지 않음 다른 작업들은 non-blocking Javascript를 사용한 비동기 통신 방식을 Ajax(Asy
클론코딩이란 클론코딩은 인스타그램, 카카오톡, 유튜브 등등 실제 서비스를 따라 만들면서 배우는 공부 방식RESOFT팀장 선정 및 팀명 선정, 역할 분담을 진행함팀장: 김00 (일정관리, 제출, 보고)팀명: Project BD기간: ~ 7월 5일 화요일 중간점검팀원 역할
🌱 클론 코딩 ✏️ 개념 클론코딩이란 클론코딩은 인스타그램, 카카오톡, 유튜브 등등 실제 서비스를 따라 만들면서 배우는 공부 방식 클론코딩 사이트 RESOFT RESOFT 🍃 1일차 회의 팀장 선정 및 팀명 선정, 역할 분담을 진행함 팀장: 김00 (일정관리,
오늘 첫 멘토링을 진행했다멘토링 프론트 작업 순서Html 작성Css 작업 유의사항class명으로 작업해놓고 속성을 모아두기주제별(글꼴 관련된/색 관련/배치 관련(패딩, 마진)) class명 만들어서 작업.장점: client 변경 시 용이한 개 단위를 섹센, 컴포넌트라고
다른 사람 Githun repository에서 자신이 수정하거나 추가하고 싶을 때 해당 repository를 내 Github repository로 복사해 오는 기능.fork한 저장소는 원본과 연결되어 있음.원본 repository에 commit이 생기면 그대로 fork
팀원들과 Git으로 모은 파일들을 확인하고 용도에 따라 정리한 다음 index.html 파일에 병합하는 작업을 진행했다. 각 파트별 html과 css 파일을 따로 관리하여 파트별로 실행에 이상 없음을 확인한 다음 index.html에 합치는 작업을 진행했다.먼저 폴더
🌱 2회차 멘토링 진행 ✏️ 멘토링 내용 1.원페이지 구현을 다했다고 어떻게 말할 수 있을까? -> 테스트 문서 만들기(문서에다가 테스트 문서 만들어서 체크해야할 사항을 리스트로 모은다. 한명씩 타인(본인)의 페이지를 체크해본다.) 모두 패스가 되면 1차적으로 다한거임. 2. a태그에 #이 들어갈 경우 순서가 바뀔 수 있다. 3. VS 소스 콘트롤이 무엇...
월요일 회의 진행상황 체크금일 진행작업 체크프로젝트 마진슬라이드 CSS 간격 설정반응형 적용2번 card-flip 기능 점검 후 피드백 공유(오늘 내)스크립트 분리수정완료 푸시종인님과 확인3번 slick-cus 기능 점검 후 피드백 공유(오늘 내)컬러 함수 사용반응형
🌱 중간점검 회의 ✏️ 회의 내용 팀원 함께 페이지 점검 시간을 가짐 이상사항 발견 카카오지도 이미지가 깨지는 현상 아이콘 페이지 미디어쿼리 추가 미디어쿼리시 필요없는 여백 발생 슬라이드 페이지 이미지 hover 효과 미적용 슬라이드 페이지 반응형 미적용 푸터 모바일 화면에서 폰트 색상 일부 미적용 수정사항 발견 후 수정 진행 깃허브 페이지 생성 후 ...
🌱 최종 회의 ✏️ 회의 내용 마지막으로 팀원들과 수정사항에 대한 페이지 검사를 진행하고 새로운 아이디어로 홈페이지를 실행하기 전 2팀이라고 알리는 alert 창 기능을 추가했다. 월요일 팀 발표로 인해 팀원들과 함께 발표하기로 결정, 발표 순서와 역할을 분담함. 발표 자료 준비 공유와 발표 내용에 대해서 공유하기로 함. 🍀 힘들었던 점 팀원들을...
🌱 최종 발표 ✏️ 발표 프로젝트를 마무리하고 발표 자료를 제작하여 각자 맡은 파트에 대해 발표를 진행했다. 내가 담당한 파트인 header 에서 발생했던 이슈들과 해결 방법 위주로 발표했다. footer도 맡았는데 공백이 적용되지 않았던 점. 팀원들 간 피드백으로 오류를 수정했던 점을 위주로 발표했다. 또한 회사 브랜드 이미지를 고려하여 추가로 진...
가장 먼저 팀원들의 의견을 모아 어떻게 진행하면 좋을지 논의했다.01\. 공통 CSS class 작성 후 배포색상 함수 선언main_tiltesub_titleheader_titleex_text(섹션 타이틀에 대한 설명)hori_margin(섹션 양옆 마진 값)02\.