개발

[CSS] 노마드코더 카카오톡 클론 코딩 챌린지 순항중

열번째 과제 제출 완료! 매순간순간 구현되지 않는 부분, 마음대로 조정되지 않는 위치 등으로 애먹고 있지만 그래도 잘 해내고 있다. 처음 계획대로 파이썬 챌린지도 병행하지 못한게 못내 아쉽지만, 지금 챌린지도 하루종일 붙잡고 있을때가 있는걸 보면, 내 능력밖의 일이었던것 같긴하다. 그래도 카카오톡 클론코딩 챌린지라도 열심히 따라가고 있음에 감사! 클론코딩이라는게 처음엔 참 막막했는데, 내 손으로 하나하나 갖춰지는 코드들을 보고있으면 뿌듯한 마음에 더 열정적으로 궁금한걸 찾게되고 시험삼아 구현해보는 등 재미가 붙는다. 좋은 컨텐츠를 만들어준 니꼬쌤에게 감사!

[파이썬] format 함수 속 튜플

학창시절부터 막히는게 있으면 문제를 해결하더라도 반드시 그 원리를 이해하고 넘어가려 했었다. 지금 파이썬을 공부하다 막힌 부분. 당최 왜 format속 튜플자료형에서 a[0]는 인덱스값을 받고 a[1]는 value값을 받아오는지 이해가 안된다.. for문에 대한 더 명확한 이해가 필요할듯 ㅠ.ㅠ 어려워라 또 이럴때는 그냥 일단 암기하고 넘어가는게 좋을지, 이렇게 원리와 이유를 파악해야하는지.. 후자는 시간이 너~~무 많이 필요하다.

[html] form의 중요한 2가지 attribute: action, method

*id와 class중 편한것은 어떤것일지 생각해보자. 주로 classa를 많이 쓰긴한다! id를 사용할 경우 상대적으로 더 많은 인자를 써야하는듯? - CSS 파일에서 주석처리는 /* */로 감싸주면 된다. - styles.css 파일에는 font-family, background-color와 같이 모든 스크린에 적용될 수 있는 스타일을 써놓는다. 이는 하나의 방식이고, 자신만의 편한 방식을 택하면 된다. - form은 중요한 2가지 속성(attribute)을 가지고 있다. 하나는 action이고, 다른 하나는 method이다. - action은 어떤 페이지로 data를 보낼건지 지정할 수 있다. - action에 적어 놓은 URL에 해당하는 파일이 반드시 존재해야한다. - method는 2가지 방식 중..

[파이썬] 노마드코더 파이썬 챌린지 3일만에 실패ㅠ.ㅠ

처음 코딩 공부를 시작하기로 마음먹었을때 추천 받았던 언어는 파이썬이었다. 초보자가 배우기도 좋고 이후 활용성도 높기 때문? 프로그래머스 기초 강좌에서 무료로 배우기 시작했었다 그리고 반정도 수강한 시점부터 노마드코더에서 html, css를 배우기 위한 클론코딩 강좌를 듣기 시작했다. 내가 쓴 코드가 에러가 나면 원인을 찾기위해 골머리를 싸는게 답답하긴 해도, 어렸을때부터 키보드 두드리는 걸 좋아해서 과정 자체가 즐거웠다. 과정이 즐거우니 의욕도 불타올랐는데, 이 열정과 함께 노마드코더에서 진행하는 2주 챌린지 과정을 두 개 등록하고 기다리고 있었다. BUT 의욕과 달리 파이썬 챌린지 내용이 생각보다 쉽지가 않다. 평소 검색을 잘한다고 자부하는 나였는데 막히는 부분에서 아무리 구글에 서치를 해도 원하는 ..

티스토리 블로그 네이버, 구글 노출 문제

워낙 성격이 급한터라 블로그를 열고 글을 몇 개 쓰지도 않아놓고 네이버와 구글에 내 포스트가 노출되는지 계속 검색했었다. 사실 누군가 보여주기보단 혼자 기록용으로 만들자고 다짐했었지만, 그냥.. 호기심에? 암튼 그로인해 티스토리 블로그가 네이버나 구글에 노출되려면 각각 네이버 서치어드바이저, 구글 서치콘솔에서 소유권을 확인하고 RSS와 사이트맵을 제출해야함을 알게 되었다. 각각 처리해주는 과정에서 티스토리 스킨 편집창에서 html코드도 확인해줬는데, 지금 배우고 있는 코드들이 보이니 반갑기도 했다. 문제는 이미 네이버에서 필요한 작업들을 해줬는데도, 내 블로그를 아무리 검색해도 노출이 되지 않고있다. 나처럼 같이 서치어드바이저에서 수집보류가 되는 경우가 많은듯하다. 해결방법은 대략 1. 포스트 주소 숫자..

[CSS] status-bar를 중앙 정렬해 위치시키는 hack! // 드디어 시작된 클론코딩!

css hack (justify-content: space-between 를 대신해 사용가능!) - 레시피 같이 어디든 쓸 수 있다. 이상하지만 작동한다. - 1 상위 박스 : justify-content: center; -중앙으로 몰림 -> 가운데 시계가 한쪽으로 쏠리는 문제가 발생!! - 2 내부 박스 범위 : width: 33%; -왼쪽으로 몰려서 범위 벌어짐, 왼쪽 위치할 박스는 왼쪽에 붙어서 정렬됨 - 3 중앙에 위치할 박스 : display: flex; justify-content: center; -중앙에 위치할 박스만 중앙에 위치함 - 4 오른쪽에 정렬할 박스 : *display*: flex; *justify-content*: flex-end; *align-items*: center; -오른..

[CSS] Flexbox, Media Queries recap

display에서 inline-blcck의 활용상 문제로 Flexbox를 고안했다. 자유롭게 box를 둘 수 있다. flexbox는 이름자체가 flexibe이다 2차원 레이아웃에서 잘 작동한다. 1) 부모 엘리먼트에만 명시해야한다. 나중에 이해하게 될것 부모 엘리먼트에만 말을 한다 3개의 dvi를 가리키는 자식을 움직이고 싶으면 flex를 할 필요없다 div의 부모에게 말하면된다 즉 body! body가 의 부모다 부모에게만 명시하면된다 부모 엘리먼트를 flex container로 만들어야한다 즉 body의 display가 flex를 주면된다 이제 body가 children을 제어할 수 있다 ※ Rule no1. flex는 부모의 display 속성에 해야한다 절대 자식에하는것이 아니다! display ..

[CSS] combinator, selector

Remember that you dont have to memorize all these things right now. You will learn by repetition in practicing. Combinator 1) div span : div 속 span을 의미. span이 div의 direct children이 아니어도 작동 2) div > span : span이 div의 direct children임을 의미. 이땐 direct children이 아니면 작동하지 않습니다. 3) div + span : div와 동등한 위치에 있는 span을 의미. div ~ span과는 달리 바로 옆에 위치해야함. 4) div ~ span : div라는 부모를 공유하는 모든 span 선택 Selector Att..