본문 바로가기
반응형

분류 전체보기127

생애 최초 Google Adsense 신청기 - 한 번에 승인(ft. 티스토리 블로그) 구글 애드센스(Google Adsense) + 티스토리 블로그 구글 애드센스는 구글의 광고 플랫폼입니다. 광고주들의 광고들을 블로그나 애플리케이션 그리고 웹페이지 등에 노출을 시켜줌으로써 광고를 실현해주고 수익을 쉐어해줍니다. 오옷? 수익을 만들 수 있다고라? 1. 티스토리 개설 - 2022년 11월 21일 저도 지금까지는 크게 관심을 갖지 않고 있다가 이번에 티스토리를 새롭게 개설하게 되면서 저도 한번 재미로(?)라도 일단 한번 신청 해보자고 생각이 들었습니다. TISTORY.는 클릭 몇 번으로 쉽게 개설이 가능합니다. 지난 11월 21일 개설 이후 1일 1포스팅을 꾸준히 하고 있습니다. 애드센스 관련하여 구글링을 해보니 라고도 불리면서 이런 저런 경험담과 노하우가 전해지고 있던데 저는 크게 신경쓰지 .. 2022. 12. 9.
재미있게 Grid 공부하기 - Grid Graden 문제풀이 15~28 CSS에서의 Grid 시스템 이란? 이전 포스팅에서도 알려드렸던 내용을 잠깐 복습하고 가도록 합니다. Flex와 달리 Grid는 각 셀을 이루는 가로축 세로축 가이드라인(=Grid)를 기준으로 합니다. 양수로 카운트 할 때는 좌에서 우로 음수로 카운트 할 때는 우에서 좌로 Grid Number를 지정할 수 있다고 했습니다. 그리고 Grid의 시작은 부모(Container) 요소에서 display: grid;를 주는 것으로 시작합니다. 그리고 grid-template-columns와 grid-template-rows를 이용해서 바둑판 모양의 격자를 만들고 시작하게 된다고 했죠? #garden { display: grid; grid-template-columns: 20% 20% 20% 20% 20%; gri.. 2022. 12. 8.
재미있게 Grid 공부하기 - Grid Garden 문제풀이 1~14 얼마 전 포스팅에서 다룬 Flexbox Froggy와 더불어 Grid를 재미있게 학습할 수 있는 Grid Garden을 한번 풀어보았습니다. 이 문제도 한 1년 전쯤에 이미 풀어보았던 것인데요, 저의 경우 Flex를 더 자주 사용하다보니 Grid에 대한 기억이 가물가물해진 김에 다시 한번 문제를 풀어보게 되었습니다. 문제는 https://codepip.com/ 에서 회원가입/로그인을 진행하면 풀 수 있습니다. 저는 처음에는 Grid가 Flex 보다 더 직관적인 것도 같고 쉬운 것도 같고 그랬던 거 같았는데 Flex를 자주 사용하다보니 Flex가 오히려 쉬워진 감이 있습니다.^^; 최근 Web에서는 Layout 배치에 있어 Flex와 Grid를 잘 섞어서(?) 사용하고 있으니 두 가지 기능 모두 잘 살펴두.. 2022. 12. 7.
버튼을 클릭하면 클립보드에 복사하기, Button, Clipboard 주말을 맞이하여 잠깐 생각해둔 바 있던 개인 프로젝트를 진행해보고 있습니다. 당근빠따 실력은 아직 미천하지만 그 동안 공부해온 내용 수준 안에서 완성을 해 볼 수 있는 수준으로 기획했습니다. Kin Converter라고 일단 대충 이름을 붙여봤는데요 상단 Textarea에 코드를 넣고 [ Convert ] 버튼을 클릭하면 변경된 코드가 아래쪽 Textarea에 출력되고 이때 알아서 복사해가거나 [ Copy to ClipBoard ] 버튼을 클릭하면 메모리에 복사가 되어 퍼가기 쉽게 하는 기능입니다. 요즘은 유튜브나 다른 서비스들에서도 저렇게 버튼을 클릭하면 생성된 코드를 메모리에 복사해주는 그런 기능들을 자주 볼 수 있습니다. 자, 실습! 일단 버튼을 하나 만들고 onclick 이벤트를 받으면 copyT.. 2022. 12. 6.
반응형