Programming/Web Programming
-
Web 프론트엔드 (1) / Git Hub 환경 세팅Programming/Web Programming 2023. 5. 1. 08:32
데이터 아트 작업 중에서 관객이 직접 그 데이터에 관여하는 작업을 만들고 싶어졌다. 그 과정에서 웹/데이터베이스/서버... 등의 공부의 필요성을 느껴 당분간은 개발 공부만 해야할 것 같다. T-T (아이좋아) 프론트엔드 공부는 html, css만 따로 배웠을 뿐.. 아예 동작 원리에 감이 안잡혀서 클래스101 강좌들을 뒤적이며 어떻게 시작해야할지, 고민이 많았다. 그러던 중, 크리에이터 개발자 사관학교 강사님이 올려주신이 수업들이 전부 내가 찾던 내용과 딱 맞아 떨어졌고, 이 강좌를 쭉 들으며 프론트엔드 - 백엔드 - 배포까지! 한방에 쭉 달려볼 예정이다. 클래스 101 [유료강좌] 개발자 사관학교 - [웹 개발자 단과바 1교시] HTML, CSS, JS 프론트엔드 속성 실무! https://class1..
-
CSS Tutorial (7) inheritance and z-index / CSS 시작하기 (7) 마지막 편 상속과 z-indexProgramming/Web Programming 2023. 1. 24. 07:40
챕터 5의 두번째 분량이다. 여기까지의 내용이 마지막 강의 내용이다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터5. 한 걸음 더 나아가기 - 상호작용, 세부 위치 등 세세한 부분까지 생각하기 (Part2) 4강. inherit (상속), initial, unset (1) 상속 (Inheritance) 상속(Inhertiance)이란 하위 요소가 상위 요소의 스타일 속성값을 물려받는 것을 의미..
-
CSS Tutorial (6) / CSS 시작하기 (6) 선택자, 의사클래스와 의사요소Programming/Web Programming 2023. 1. 23. 14:24
마지막 5챕터의 내용들이다. 분량이 많아 2편으로 나누지 않을까 싶다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 5챕터. 한 걸음 더 나아가기 - 상호작용, 세부 위치 등 세세한 부분까지 생각하기 1강. 선택자 2편, 특성 선택자와 결합자 (1) 선택자 선택자란 어떤 요소에 스타일을 적용할 것인지에 대한 정보. (2) 선택자의 종류 기본 선택자 => (1)편에서 다룬 내용 그룹 선택자 => (2..
-
CSS Tutorial (5) flexbox / CSS 시작하기 (5) flexboxProgramming/Web Programming 2023. 1. 23. 10:34
4챕터 flexbox에 관한 내용이다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터 4. flexbox - flexbox 속성 활용하기 1강. flexbox 1편, 정의 및 사용 방법 (1) flexbox flexbox란 flex박스 내 요소 간의 공간 배분과 정렬 기능을 제공하기 위한 1차원 레이아웃 모델이다. 1차원 레이아웃 모델이란? flexbox를 1차원 모델이라 부르는 이유는, 레이아..
-
CSS Tutorial (4) set position / CSS 시작하기 (4) 위치 정하기Programming/Web Programming 2023. 1. 23. 08:42
챕터3의 주제는 위치 정하기 float과 position이다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터3. 위치 정하기 - float과 position 1강. float 그리고 clear (1) float float 속성은 요소가 문서의 일반적인 흐름에서 제외되어 자신을 포함하고 있는 컨테이너의 왼쪽이나 오른쪽에 배치 되도록 한다. 문서의 일반적인 흐름이란 무엇일까? 흔히 웹브러우저에서 렌..
-
CSS Tutorial (3) Box Model / CSS 시작하기 (3) 박스 모델Programming/Web Programming 2023. 1. 22. 10:25
챕터 2의 중반부터는 박스모델 관련 내용이 주를 이룬다. 중요한 부분이라고도 말씀하시고 자료를 다시 자주 찾게 될 것 같아 따로 박스모델 부분만 모아 작성해본다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터2. 텍스트와 박스 모델 - 텍스트, 여백 그리고 배경까지 3강. 박스모델 1편, 박스모델 소개 (1) 박스모델 (Box-Model) 브라우저가 렌더링 할 때 모든 요소들은 기본적으로 사각형..
-
CSS Tutorial (2) / CSS 시작하기 (2)Programming/Web Programming 2023. 1. 22. 06:15
이어서 챕터2 내용도 작성해 남겨놓는다. 수업을 들을때는 기억이 나는데.. 한 하루 이틀만 지나면 금붕어처럼 까먹어 버리기 때문에! 이 글은 강의를 듣고 정리한 내용이다. 강의는 클래스101, 유노코딩 강사님의 프로그래밍 입문자를 위한 CSS 기초이다. https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터2. 텍스트와 박스 모델 - 텍스트, 여백 그리고 배경까지 1강. 텍스트 꾸미기 속성 (1) 텍스트 관련 속성 종류 1) font-family : 글꼴 정의 2) font-size ..
-
CSS Tutorial (1) / CSS 시작하기 (1)Programming/Web Programming 2023. 1. 22. 02:20
지난번에 html을 튜토리얼을 마쳐서 이어서 CSS 튜토리얼을 공부하려고 한다. 클래스 101, 프로그래밍 입문자를 위한 CSS 기초를 보고 공부한 내용 위주로 작성될 예정이다. HTML도 같은 강사님께 들었는데 설명도 엄청 자세하게 해주시고 실습도 알차서 재밌게 배웠었다! 이번에도 완강까지 화이팅.. 혹시 몰라 남겨놓는 강의 링크 (유노코딩 검색 / 유로 강의입니다!) https://class101.net/ko CLASS101+ | 세상의 모든 클래스를 하나의 구독으로 2700개 이상의 클래스로 일러스트, 공예, 코딩, 부업, 주식까지 세상의 모든 분야를 배워보세요. CLASS101에서 14일 무료 체험해 보세요. class101.net 챕터1. CSS 시작하기 - CSS 기본 문법 및 작성 방법 1강..