전체 글
-
HTML CSS 8일 완성하기 : 4일차 CSS 디자인 가이드라인html ・ css 2023. 2. 8. 21:00
힘들었다 ... (내가 듣는 강의는 여기) 심지어 이번에는 직접 코드를 짜는 거보다 설명이 많아서 더 힘들었다 .... 근데 내용 자체는 재미있었다. 디자인 ... 에 천부적인 재능(?)이 없다는 걸 저번에 만들면서 절절하게 느꼈기 때문에(ㅋ) 이런 식으로라도 지식을 집어넣고!! 만들 때 고려하면서 만들면 되겠다 싶었다. 좋은 사이트도 많이 알게 되어서 기쁘다 ^_____^ 오늘은 나름 빨리 기록을 끝낼 수 있을 듯!! 그럼 시작~ 디자인은 디자이너만의 일? 디자이너 분이 디자인을 만들어주시고 그걸 내가(개발자) 그대로 구현하고 사용자에게 전해진다. 가 일반적이라고 생각했는데 요즘에는 그렇지도 않다고 한다. 개발을 하는 디자이너도 많아지고, 디자인을 하는 개발자도 많아지는 추세라고. 개발하는 "디자이너"..
-
HTML CSS 8일 완성하기 : 3일차 CSS Layouthtml ・ css 2023. 2. 8. 13:46
3일 차! 내가 듣는 강의는 여기 사실 강의는 어제 다 들었는데 ... 일정 때문에 늦게 듣기 시작해서 포스팅을 못하고 잤다 >_ 그 구조에 콘텐츠들을 넣는 것! 레이아웃을 정하는 세 가지 방법 레이아웃을 정하는 방법은 총 세 가지가 있다. 첫 번째, float 두 번째, flex box 세 번째, grid 로 모두 block box인 요소에 display 속성을 추가하여 사용할 수 있다. css의 레이아웃은 css의 뼈대를 잡는 것과 비슷하다고 느꼈다. 뼈대라면 더더욱 잘 알고 있어야 하는 법 ! 망각곡선을 다시 끌어올리기 위해 (ㅎㅎ) 세 가지 방법에 대해 기록하고자 한다. float MDN float는 옛날에 css 레이아웃을 구성할 때 사용하던 방법으로 지금은 flex box, grid에 의해 대..
-
HTML CSS 8일 완성하기 : 2일차 CSS의 기초카테고리 없음 2023. 2. 6. 21:20
강의는 여기 오늘은 섹션 3. CSS 기초에 대한 내용이었다. 확실히 기초부터 딱 잡고 넘어가니까 그동안 해왔던 것들에서 이렇게 수정하면 되겠구나 ~ 싶어서 기분이 좋다. 강의 다 들으면 북마크 웹앱 전체적인 수정에 들어가야겠다 🧑💻!! 그럼 오늘도 기록 시작~ 시각적인 부분을 담당하는 CSS, 어떻게 연결할까? 연결하는 방법에는 총 세 가지의 방법이 있다. 하지만 마지막 방법을 제외하고서는 99.9퍼센트 사용하지 않는다고 봐야한다는 점을 먼저 짚고 넘어간다. 1. inline CSS HTML 요소 안에 style 속성을 추가하여 원하는 스타일을 적용하는 방법. 🙅절대 사용하면 안된다🙅 코드는 자고로 분리해서 사용해야 미래에 수정, 추가 등 할 일이 있을 때 편하다. 혹시나 오류가 생긴다면 고칠 때도 ..
-
HTML CSS 8일 완성하기 : 1일차 OT, HTMLhtml ・ css 2023. 2. 5. 19:29
최근 html css 기초지식이 부족하고, 아주 간단한 것도 나에게 설명하지 못하는 현상에 많은 충격을 받았다. 때문에 기초부터 탄탄하게 지식을 쌓고 싶어서 강의를 찾아보기로 마음먹었다. 찾아보다가 유데미 강의들이 가성비가 좋고 질이 좋다고 들었기에! 도전!! 8일 완성이라는 건 그냥 나의 목표로, 오늘(2/5)에 시작했으니 오늘을 포함해서 2/12에 완강하는 게 목표이다. 기록은 나의 자산 ^_____^ 아주 간단하게라도 그날그날 공부한 기록을 남겨두기로 했다. 내가 듣는 강의는 여기 오늘은 총 두 개의 섹션을 수강했다. 섹션 1은 오리엔테이션과 다름없고, 섹션 2는 HTML 섹션이었다. 이상! 내용은 밑에 기록한다. 🧑💻 이 문서가 HTML 문서라는 것을 브라우저에게 알려준다. (즉, 문서 유형을 ..
-
바닐라JS 로 만드는 북마크 웹앱 📓 (2) 게시물 편으쌰으쌰 2023. 2. 4. 19:40
바닐라 JS로 만드는 북마크 웹앱 📓 2편 ~ 게시물 편 ~ 게시물이라고 하기에는 애매하지만 설명의 편의를 위해 게시물 편이라고 이름 지었다. 정확히는 인상 깊은 구절, 발췌 내용 등을 기록한다는 느낌이 강하다는 걸 먼저 밝힌다. 참 고민도 많고 시간도 많이 걸린 게시물 편을 기록한다. 🤸🏻 구현한 기능은 게시물 저장 / 확인 / 수정 / 삭제로 총 네 가지 기능이다. 천 리 길도 한 걸음부터, (0) 계획 편 (1) 회원가입/로그인 편 보러 가기 👏 📌 계획편 📌 회원가입/로그인 편 ✔︎ 게시물 저장 0. 로그인을 성공하면 게시물 작성을 위한 form이 보인다. 1-1. 발췌내용을 저장하는 textarea. 1-2. 출처명을 적는 (책 제목, 화자 이름 ... 등) input(type=text). 1-..
-
바닐라JS 로 만드는 북마크 웹앱 📓 (1) 회원가입, 로그인 편으쌰으쌰 2023. 1. 25. 16:16
바닐라 JS로 만드는 북마크 웹앱 📓 1편 ~ 회원가입, 로그인 편 ~ 로컬스토리지를 사용해서 회원가입, 로그인 기능을 구현하는 건 저번에 해 본 경험이 있다. 덕분에 (처음보다) 쉽게 구현할 수 있었다. 최선을 다했지만 그때보다 더 적당한 코드를 사용했는지, 무엇을 수정하면 좋았을지.. 등등 혼자 판단하기 어려웠다는 점이 아쉽다. 하지만 이것만은 확실하게 깨닫고 있다. 기록은 언제 어디서든 도움이 될 수 있다는 사실! 간단하게 회원가입, 로그인 기능을 구현한 코드 등을 남겨둔다. 🤸🏻 천 리 길도 한 걸음부터, 로그인 회원가입 기능 구현 게시물 보러 가기 👏 (1) 회원가입 편 (2) 로그인 편 (3) 총정리 편 ✔︎ 회원가입 1. ID 중복 검사 (입력받을 때마다 체크) 2. 비밀번호 확인 검사 (같..
-
바닐라JS 로 만드는 북마크 웹앱 📓 (0) 계획 편으쌰으쌰 2023. 1. 24. 18:37
이번에 만들어 볼 웹앱은 바로바로~~ 📓 북마크 웹앱 📓 저번과 다르게 계획서부터 (?) 차근차근 하기 위해서 이번엔 0편! 계획 편! 0. 북마크 웹앱 ? 처음에는 To-Do 리스트를 구현해볼까 했지만, 이왕 하는 거 비슷하지만 관심있는 걸 만들고 싶었다. 투두리스트 같은 경우에는 매일 들어가서 사용해야하지만, 이상하게 컴퓨터나 핸드폰으로 하면 매일 하기 힘들어서 ^👅^;; 가끔 들어와서 와다다다 기록하는 나만의 장소 ... 가 갖고 싶었다. 책 읽으면서 필사를 자주 하는 편인데 그것들을 좀 더 보기 편하게 정리할 수 있겠다! 싶어서 바로 구현 도전. 1. 어떤 기능을 구현할까? 만들고 싶은 기능 아무렇게나 적어두는 것 보다는 주기능 / 부가기능으로 나누기로 했다. 주기능 ✔︎ 로그인 ✔︎ 회원가입 ✔..
-
JavaScript I 정규 표현식 박살내기 💢Javascript 2023. 1. 23. 18:47
정규 표현식 박살내기라는 거창한 제목을 짓긴 했지만, 사실 목적은 이거 뭐였지 할 때 찾기용으로 작성했다. (ㅎㅎ) 언젠가는 너무나 자연스럽게 사용할 그날을 위해 파이팅~ 0. 정규 표현식이란 무엇인가? 정규 표현식은 일정한 패턴을 가진 문자열 집합을 표현하기 위해 사용하는 형식 언어이다. 자바스크립트라고 제목에 붙여놓기도 했으나 사실 JS 고유 문법은 아니다. 대부분의 프로그래밍 언어, 에디터에 내장되어 있다. 문자열을 대상으로 패턴 매칭 기능을 제공하는데 이는 특정 패턴과 일치하는 문자열을 검색 / 추출 / 치환 할 수 있다는 걸 의미한다. 알고리즘 문제를 풀 때 나도 모르게 조건문, 반복문을 통해 체크했었다. 정규식을 이용하면 한 번에 체크 가능하다는 걸 꼭 기억하자! 하지만, 가독성이 좋지 않다는..