🌳 학습내용 ) 반응형 웹 사용하는 이유 장점 1) 모든 기기에서 접속가능 2) 가로모드에 맞춰 레이아웃 변경가능 3)사이트 유지 관리 용이 4) 최신 웹표준에 따름 단점 1) 사이트 디자인이 단순해진다 2) 하위 버전 브라우저와 호환성
🍎학습내용 주제 반응형 웹 만들기 @media 활용하기 768px 보다 작을때 header가 2단으로 바뀌도록 처리 html CSS code @media 커리 적용후 메뉴바 gird 사용법 > display:grid; /grid
반응형 웹
🍎학습내용 주제 반응형 웹 및 SCSS작성방법 및 loading 라이브러리 사용법 및 getskeleton사용법 1) 나만없어 고양이 블로그 사이드 박스 css 반응형 웹 적용 @media 를 활용하여 min-width 600이하일때
부트스트랩5
Bootstrap5 활용하여 홈페이지 만들기
🍎 닷홈 호스팅 인터넷을 통하여 웹서버와 통신을하여 웹 클라이언트에와 통신을 할수있다. 웹서버를 도와주는 SW와 webclient와 통신을한다. 웹서버와 웹클라이언트를 분리하여서 운영하는 곳
🍎 워드 프레스 (WordPress) 워드 프레스란 개발을 잘 모르는 사람들도 쉽게 서버를 관리하고 또 유지 보수할수있게 도움을 주는 서비스이다. 우리가 웹페이지를 만들기 위하여 보통 html 과 css javascript등 다양한 언어의 집합체가
플로그인에서 KBoard위젯을 활용하여 한국인들이 가장 자유 사용하는 게시판을 활용할수있다.플로그인에서 상세보기를 눌러무료 게시판 KBoard를 다운받아 적용해주면된다.적용을해주면 이렇게 게시판이 생기게된다.kbboard 탭에서 전체적인 게시글을 종합적으로 관리 감
🍎 자바스크립트 웹 개발 웹 개발은 브라우저 화면에서 보이는것이 전부가 아니다. html/ css/ javascript 등등 다양한 구성으로 만들어져있고 이것을 서버와 클라이언트를 연결하여 사용자에게 정보를 제공한다. 프론트엔드 개발자 = 클라이언트가 보는 화면을 구성하는 사람 백엔드 개발자 = 서버를 연결을 하여 사용자가 웹에 접근할수있게 해주는사람...
🍎 자바스크립트 개념 강의 1) "안녕하세요"[1]은 index 문자열로 1번째 녕을 찾는다 컴퓨터는 숫자를 0부터 읽기 때문에 만약 index 0을 찾게된다면 안을찾게 된다. 2) "안녕하세요".length 문자열의 길이를 파악할때 사용한다 안녕하세요 경우는 5를 반환한다. 3) 나머지 연산자 % 5%2 = 1 6%2 = 0 9%3 = 0 12% =...
각 배열 요소엔 0부터 시작하는 숫자(인덱스)가 매겨져 있습니다. 이 숫자들은 배열 내 순서를 나타냅니다.배열 내 특정 요소를 얻고 싶다면 대괄호 안에 순서를 나타내는 숫자인 인덱스를 넣어주면 됩니다.새로운요소를 추가 해줄수도있다.🔥 배열 요소의 자료형엔 제약이 없습
While 반복문이며, 조건문이 참일 때 실행된다. 문장안이 실행되기 전에 참 거짓을 판단을 한다. for문과 while문의 차이 while은 조건밖에 없기 때문에 몇 번 반복될 지 모를 때 주로 사용되고, for문은 반복 횟수를 정할 수 있기 때문에 몇 번 반복될 지 알 때 주로 사용됩니다. 주의사항 🔥 while문의 경우 값을 잘못 할당하게 된다...
🍎 자바스크립트 함수란? 함수(function)을 사용하면 무엇이 좋은가? 각 명령의 시작과 끝을 명확하게 구별할 수 있다. 함수에 별도의 이름을 붙이면 같은 기능이 필요할 때마다 해당 함수를 실행할 수 있다. 함수의 선언(함수 정의) 함수가 어떤 명령을 처리
🍎 이벤트 웹 브라우저나 사용자가하는 행동 이벤트의 종류 마우스 이벤트 키보드 이벤트 폼 이벤트 문서 로딩 이벤트 버튼 클릭하여 상세설명 열고 닫기 원클릭을 버튼안에 넣어 사용이 가능하지만 편하게 만들수있지만 이후 유지보수가 힘들다. 이벤트 토글로 열고 닫기 실
배열 실습 1 🔥 실습 2 🔥 Math.floor 소숫점 아래 버림 Math.random 0과 1 사이 랜덤 숫자 생성 자동으로 랜덤명언 생산 실습 3 🔥 ![](https
추가적인 공부가 필요한것 같다.
한번 만들어봤던 홈페이지라 쉽게 따라 만들수있었던것 같다
🍎 JQ기본 환경설정 개발환경 구성 JDK 설치링크 => JDK 이클립스 설치링크 => 이클립스 Apache tomcat 설치링크 => Apache tomcat JQ를 사용하는 이유 🙊 2006년 존 레식이 뉴욕 시 바 캠프에서 공식적으로 소개 간략, 강력하게 사용할 수 있도록 설계 가장 인기있는 JavaScript 라이브러리 아직까지도 우리나라
🍎 jq활용하기 window.onload ready > jQuery 함수는 JavaScript 객체에 jQuery에서 정의한 멤버를 추가하여 반환하는 함수 jQuery(객체) 형태로 사용하지만 $(객체)로 사용할 수 있다 Ready는 window.onload와 다르게 모든 부분이 실행 jQuery 선택자 > • 기본 선택자 • 기본 선택자 조합 •...
🌝 학습 소감
🌟 증가 및 감소 버튼 적용하기 🌟Storybook 활용하기 > 1. stroybook을 설치하기 위해 프로젝트 생성하기 npx -p storybook sb init 을 사용하여 폴더안을 초기화시켜주기 npm run storybook 으로 실행하기 text 만들기 Input 만들기 리엑트에대하여 더 공부가 필요하다고 생각이들었다.
🎈 컨텍스트 🎄개념 리액트 컴포넌트는 리액트 엘리먼트를 조금 더 자유롭게 다루기 위한 하나의 문법입니다. 🎄 접근 방법 consumer useContext conTextType 🎄 프로젝트 생성 1 app.js components/Title.js components/Message.js components/Button.js 실습 cons...
🎈 Redux 🎊 개념 JavaScript 상태관리 라이브러리 Node.js 모듈 상태관리 툴 종류: React Context, Redux, Mobx -JavaScript 상태관리 라이브러리 Node.js 모듈 상태관리 툴 종류: React Context, Redux, Mobx 🎊 상태관리 필요성 상태관리 React에서 State는 comp...
클론 코딩 클론 코딩 사이트 🎈 1일차 회의 🎈 초기 모인 인원 총 6명 2명 개인사정으로 인하여 불참 4명에서 팀프로젝트 진행 시작 다른 조 인원들보다 인원이 적었기 떄문에 1차적으로 각자 원하는 페이지를 하나씩 선택하여 화요일 오전 회의 전까지 완료해오는 것으로 1차적인 계획을 잡았다. 🎄 내가 맡은 파트 🎄 프로젝트를 할때 도움이 될 사...
클론 코딩 클론 코딩 사이트 🎈 2일차 회의 🎈 인원 보충으로 총 인원 6명으로 프로젝트가 진행되게 되었다. 추가 인원2 명의 경우 늦게 합류하여 아직 프로젝트를 실행하지 않았기 때문에 역활 분담 및 목표 설정을 하였다. 초기 인원 4명의 경우 나머지 2명의 인원이 프로젝트를 완성을 하지 못하였기 떄문에 내일 다시 코드와 완성한 파일을 함께 보며 ...
클론 코딩 클론 코딩 사이트 🎈 3일차 회의 🎈 강사님 멘토 활동을 해주었다. 궁금했던 점들에 대하여 물어보았다. wow.js 사용법과 애니메이션css활용법에 대하여 배웠다. 마크업 확인사이트를 통하여 자신의 html css js파일들이 마크업이 잘되어있는지를 확인하여 더 좋은 사이트를 만들수있도록 확인해주는 사이트라고 한다. 각 팀원들의 진행...
클론 코딩 클론 코딩 사이트 🎈 4일차 회의 🎈 오후 팀회의를 진행하였다. 오늘의 각 팀원에 현재 진행상황을 파악하고 피드백을 하는 시간을 가졌다. 성** 님 프로젝트를 이미 완성을 하셔서 최종적으로 파일을 합치지기 전에 세부적인 디테일에 대해서 한번더 점검
클론 코딩 클론 코딩 사이트 🎈 5일차 회의 🎈 오후 팀회의를 진행하였다. 오늘의 각 팀원에 현재 진행상황을 파악하고 피드백을 하는 시간을 가졌다. 성** 님 본인 파트를 완성을 하였기 떄문에 이제는 최종적으로 파일을 합치기 전에 폴더명 및 파일명 정리후 파일을 받기로 하였다. 손** 님 카드를 뒤집었을때 뒷 카드면의 내용이 없어지는 현상이 일...
클론 코딩 클론 코딩 사이트 🎈 7일차 회의 🎈 오늘은 최종적으로 모든 팀원들이 프로젝트 파일을 보내준 날이였다 최종적으로 파일은 내일 합쳐볼 예정이다. 이렇게 모든 인원들이 프로젝트를 끝이나 이제 마무리 단계로 각자 자신이 만든 페이지의 기술구현 파트에대하여 작성하기로하였다. 이후 금요일 마감전까지 버그 및 수정 사항이 있을시 추가예정이다. ...