본문 바로가기

웹코딩

 (12)
eapi eapi는 엔트리 api를 쉽게 다루기 위해 생긴 라이브러리입니다. 코드ㅣraw.githubusercontent.com/ddtt786GH/eapi/main/code/index.js 업데이트 목록ㅣgithub.com/ddtt786GH/eapi/commits/main eapi 파일과 동일한 파일에 코드를 작성할 경우 export를 빼고 사용하세요. 코드 eㅣ작품,나,커뮤니티와 관련되지 않은 api를 다루는 객체입니다. > loginㅣ엔트리에 로그인합니다. ex) e.login("id","password") > logoutㅣ로그인 되어 있는 계정에서 로그아웃합니다. > homeㅣ엔트리 홈 화면으로 갑니다. > staffㅣ스태프 선정 작품들의 id를 반환하는 함수입니다. e.staff("now") 는 지금 스태..
html 강좌 아이디어가 없네요 ㅋㅋ 댓글로 추천좀 부탁드립니다.
html 6강ㅣp 태그 오랜만에 강의를 올리네요! 이번에는 p 태그를 배워보겠습니다~ p 태그는 무슨 역할일까요? p라는 이름만으론 뜻을 전혀 유추하지 못해서 다들 다양한 것을 상상하셨을거 같은데요~ p 태그는 "문단"을 만들 때 쓰는 태그입니다. 정말 많이도 이름을 줄였네요 ㅋㅋㅋ 아무튼 이 태그의 용도는 문단을 나누는 건데요, p 태그로 글자를 감싸면 그걸 html이 한 문단으로 구분해줍니다. 말로만 하면 어려우니 직접 해볼까요? 일단 문단으로 나누기엔 글자가 너무 적으니 좀 더 적어보겠습니다. 이렇게 바꿨는데, 이미지를 기준으로 2문단으로 나눠보겠습니다. p태그는 body 태그처럼 문단을 묶는 역할을 하지만 시각적인 변화가 눈에 보입니다. 이렇게 바꾸고 한번 볼까요? 이렇게만 보면 아무런 차이가 없는거같은데요, p 태그를..
html 5강ㅣhtml, head, body 태그 코드는 성공적으로 작성했지만 뭔가 불편합니다. 왜냐하면 h1, strong, img 태그는 탭 화면에 바로 보이지만, title 태그는 탭 화면에 보이지 않습니다. 그래서 뭔가 구분하고 싶단 말이죠. 탭의 모양을 나타내는 태그들을 묶고싶단 말이에요. 그리고 그게 아닌 태그들도 따로 묶고싶네요. 어떻게 해야할까요? 바로 body, head 태그를 사용하면 됩니다. body 태그를 먼저 해볼까요? vsc에서 라고 입력하면 로 자동완성시켜주는데요, 왜일까요? 간단합니다. 그 자체로 뭘 할 수 있는 게 아니거든요. body 태그는 탭 화면에서 보이는 것을 묶는 태그인데, body 태그만 있으면 아무것도 하지 못합니다. 애초에 묶는 역할이기 때문이죠. 그럼 body 태그에 h1, br, img 태그같은 것들을 다..
html 4강ㅣtitle 태그 지금까지 다 완벽했어요. 하지만 허전한 점이 하나 있습니다. 뭐냐고요? 바로 사이트의 제목이에요. 유튜브를 한번 볼까요? YouTube 라고 되어있는 것을 볼 수 있습니다. h1 태그를 이용해서 웹 페이지 상에서는 제목을 출력하게 했지만, 정작 탭 표시줄에서는 파일 이름이 나온단말이죠. 그럼 어떻게 탭 표시줄에서 표시되는 제목을 바꿀 수 있을까요? 바로 title 태그로 바꿉니다. title 태그는 이렇게 생겼습니다. title 태그는 그 자체로 뭘 할 수 있는 태그가 아니라, 글자를 감싸면서 "이건 탭 표시줄에서 표시되는 제목이야" 하는 역할이기 때문에 2개입니다. h1 태그랑 비슷하죠? 한번 이렇게 해보겠습니다. 잘 표시됨을 확인할 수 있습니다. 감사합니다! 다음 시간에 뵙겠습니다.
html 3강ㅣimg 태그 img 태그라... 무슨 역할일 것 같나요? 대충 아셨을 분도 있을 거 같은데요, 바로 "이미지"를 보여주는 역할을 하는 태그입니다. 여러분은 img 태그가 어떻게 생겼을 것 같나요? 태그처럼 2개일까요? 아니요. img 태그는 1개입니다. 왜 1개일까요? 그 이유는 간단합니다. img 태그는 무엇을 감싸면서 "이건 이거다" 하는 게 아니거든요. 그냥 이미지 그 자체입니다. 생각해보세요. 글자를 감싸면서 "이건 이미지야" 할 순 없잖아요? 그래서 img 태그는 하나뿐이랍니다. 근데, 이렇게 되면 문제가 생깁니다. 어느 이미지를 표현한다는건지 html이 알 수가 없잖아요. 심지어 사람도 몰라요. 이건 무슨 이미지를 뜻하는지 아무도 모릅니다. 그래도 궁금하니 한번 해볼까요? 이렇게 해보겠습니다. 열어보면 아..
???:JS에는 sin과 cos가 없나요? 이렇게 하시면 됩니다. Math.sin() Math.cos() 좀 더 객체지향적이게 하려고 이렇게 한 것 같네요 :)
html 2강ㅣbr 태그 지금까지 알아봤던 것들은 어떻게 생겼나요? 맞습니다. 이렇게 생긴 게 2개 있었죠? 이런 식으로 말이죠. 하지만 "br"이라는 태그는 약간 특이합니다. 지금까지 알아봤던 것들은 요소들을 감싼다는 느낌이 강했다면, 이건 감싸는 게 아니라 그냥 태그 그 자체로 뜻을 가집니다. "br"이라는 태그 안에 뭘 넣을 수 없어요. br 태그는 이렇게 생겼거든요. 이전 글을 보셨던 분들이라면 뭔가 좀 이상하다고 느끼실 수 있습니다. 왜냐하면 이전 시간에 배웠던 태그들은 다 이렇게 생겼거든요. 하나로만 끝나는 게 아니라 2개입니다. (하나) (둘) 2개죠? 왜 하필 2개고 또 2번째 건 왜 "/" 이게 들어가는 걸까요? 가 2개인 이유 이전 시간에 h1 태그는 글자를 감싸면서 html에게 "이거 제목이야"라고 전달해주는..
티스토리 기본 스킨만으로 예쁘게 만들기 Poster 스킨만큼 잠재력 높은 스킨이 또 없습니다. Poster 스킨을 예쁘게 만드는 법을 알아보겠습니다. 1. 커버 설정 Poster 스킨은 커버 기능이 최고의 하이라이트라고 할 수 있는데, 안 쓰는 분이 많더라고요 😅 꾸미기>스킨 편집으로 들어가셔서 "커버"를 눌러주세요! "커버 아이템 추가" 를 눌러주세요! "슬라이더" 로 설정하고 "저장" 버튼을 눌러주세요! 그리고 한 번 더 "커버 아이템 추가"를 눌러주시고 "리스트" 로 설정하고 저장해주세요! 훨씬 더 깔끔해졌음을 알 수 있습니다. 적용하기 전 모습 또 (저 사진에는 이미 적용되어 있지만) 버튼이 딱딱하지 않고 부드럽게 border-radius를 설정해주겠습니다! 코딩 모르시는 분들도 쉽게 따라하실 수 있어요~ "html 편집"을 눌러주시고..
html 1강ㅣ태그의 의미 html은 문법 없이 적어도 글자가 출력은 되는데요, 작성한 html 파일을 열어보면 그 사실을 알 수 있죠. 파일 탐색기에서 작성한 html 파일을 2번 눌러서 열어보겠습니다. (이런 창이 뜨면 자주 쓰는 브라우저를 선택한 후 "항상 이 앱을 사용하여 .html 열기"를 클릭해주세요.) 잘 열렸네요. 입력한 글자도 잘 출력되는거 같은데... 약간 이상한 점이 있습니다. 줄바꿈이 없어요! 분명 파일에서 줄바꿈을 했는데 말이죠. 이런 것 때문에 html 문법을 배워야 하는 필요성이 생깁니다. 일단 "오늘의 일기" 이걸 다른 것과 구분할 필요가 있어보이네요. "오늘의 일기"는 제목인데 다른 글자랑 다를 게 없어요. 그럼 어떻게 구분시키냐고요? 바로 "태그"로 구분시킵니다. 태그 "오늘의 일기" 이걸 제목으로..

티스토리툴바