HTML/CSS8 3. 이용약관에 대한 회원가입 페이지 만들기 - 다음 사진과 같이 이용약관에 대하여 페이지를 구성함- 이용약관의 내용 부분의 경우 생략하여 일부 내용만 추가하였기에 추후 사용시에는 변경해야 함 >> form 태그 내의 input 태그의 checkbox 타입 이용- 이용약관 동의를 받기 위해 checkbox를 이용했다.- 이는 활성화시 체크되어있는 박스로 렌더링 하는 기능을 가진다.- 를 작성하여 쓸 수 있다. >> overflow:scroll 이용- overflow를 통해 자식요소의 크기가 부모 요소의 크기를 초과했을 때 스크롤바 생성을 제어할 수 있다.- 이용약관의 세부적인 내용의 길이가 너무 길다보니 div 내에 scroll을 달아서 이를 조절했다.- 또한 이용약관 뿐만 아니라 전체적인 폼 태그에 대해서도 height를 정해두고 이를 넘어가면 .. 2024. 10. 20. 2024.07.10(수) 슈퍼코딩 부트캠프 신입연수원 week3 Day3 일일보고 - 68강 ~ 71강 강의듣기- 일일보고 작성하기 68강 Big Picture >> 지금까지 기초를 배웠으니 생산성을 높여보자 !- 다양한 도구들을 사용해서 더 쉽고 빠르게 어플리케이션을 만들어보자.- HTML, CSS, JS는 프론트엔드의 근본 3대장 but 이것들로만 개발하기에는 생산성이 떨어짐- React, Vue, Angular, Svelte 등의 웹프레임워크가 많음-> React가 가장 많이 쓰이지만 이는 새로운 문법과 원리를 이해해야하므로 우리가 배운 문법을 그대로 사용하는 Svlete를 살짝 배워보겠다 ! 69강 거대한 프로그램을 만들기 위한 번들러의 이해 - Vite>> 자바스크립트의 태생- 자바스크립트는 간단한 동작만을 위해 태어났기에 여러개의 파일을 나눠서 개발하는 모듈 방식이 없는 .. 2024. 7. 11. 2024.07.08(월) 슈퍼코딩 부트캠프 신입연수원 week3 Day1 일일보고 - 58~63강 강의듣기- 일일보고 작성하기 58~59강 저장된 게시글을 확인하려면? GET!1. index.js를 통해서 메인화면 구성하기 >> 원래 맨 처음에 html에서 화면을 구성했던 코드 블루투스 키보드 팝니다 서초동 4시간 전 5,000원 ; >> html코드를 바탕으로 js에서 다음과 같이 구현할 수 있다.const renderData = (data) => { // data = [{id:1,title:'aa'...},{id:2,title:'bbb'...}..]이런형태 const main = document.querySelector("main"); data.reverse().forEach(async (obj) => { // 배열 각각에 대해서 반복.. 2024. 7. 9. 슈퍼코딩 웹개발 부트캠프 1주차 신입연수원 후기 - 이번주 목표 달성 여부 -> 성공- 다음주 목표 설정 -> 이번주의 경우 성공은 하였으나 계획한 것보다 시간소요가 많이 되었다. -> 다음주는 조금 더 속도를 내서 할 수 있도록 해야겠다. >> 효율적인 시간 관리- 나의 경우에는 오전일과가 있기때문에 틈틈히 공부를 하고 있는데 코딩의 특성 상 하고 있다가 흐름이 끊기면 다시 흐름을 잡는데 시간이 걸리는 것 같다.- 아직 지금 배운 언어들이 익숙하지 않아서 더 그런 것 같은데 익숙해지도록 많이 노력해야겠다. >> 부족한 점 / 스스로 시도해본 것들- 우선 현재는 프론트엔드에 대해서 배우고 있는데 앱개발을 프론트엔드로 살짝 해본 적이 있어서 조금은 익숙한 부분들이었다.- 그래서 강의를 들으면서 우선적으로 혼자 구현을 해보고 추가적으로 강의를 들으며 나.. 2024. 6. 23. 2024.06.20(목) 슈퍼코딩 부트캠프 신입연수원 week1 Day4 일일보고 - 19강 ~ 22강 듣기- 일일보고 적기 19. 클론코딩(당근마켓)-2>> 이번 강의에서는 footer 부분 만들기- justify-content:space-evenly; = 화면을 키워도 반응형으로 변화함 (center로 하면 화면을 키우면 그냥 중앙에만 몰려있음)- 폰트 적용하는 법 -> https://github.com/orioncactus/pretendard에 접속해서 html 링크 복사 후 내 코드에 link 이용해서 연결 -> 폰트 코드 복붙(내가 한건 font-familiy)해서 내 코드에 link로 연결 -> 그러면 끝 ! *실행화면 20. 클론코딩(당근마켓) - 3>> main 부분 만들기- 메인은 상품당 하나씩 큰 블럭이 있고 그 안에 이미지 블럭과 설명 블럭으로 해서 또 나누어진다.. 2024. 6. 22. 2024.06.21(수) 슈퍼코딩 부트캠프 신입연수원 week1 Day3 일일보고 - 16강 ~18강 듣기- 일일보고 작성하기 16. CSS 응용 - 컬러와 애니메이션 >> CSS에서 color 쓰는 법- 크롬에서 확장앱 설치(나의 경우에는 Amazing color picker를 설치함)- 확장앱을 통해 추출한 rgb나 hex를 이용하면 됨 * index.html 실습코드 * style.css 실습코드:root { --main-color: rgb(52, 152, 218); --sub-color: rgb(252, 111, 62);}/* rgb, hex 값으로 색을 지정해도 되지만 보통은 ':root'를 통해 변수로 지정해줌 */div { width: 100px; height: 100px; background-color: var(--main-color); .. 2024. 6. 21. 이전 1 2 다음
