본문 바로가기

개발7

프런트엔드 개발자에게 추천하는 사이트 모음 (특히 뉴비) 방가링입니다!아래 사이트를 통하여 좀 더 빨리 일을 끝내시거나 적더라도 도움이 되었으면 좋겠네요.제가 그랬던 것처럼.개발 관련Codepen 세트 CodePenAn online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications.codepen.io PugHtml - Pug and HTML online converter in realtime pughtml.com SCSS to CSS Online Converter - Json2CSharp Toolkit json2csharp.com Ba.. 2024. 10. 20.
개인정보보호를 아십니까? "뭘 당연한 소리를." 하고 넘길 수 있는 질문입니다.그러나 내가 이에 대해서 명확히 잘 알고 있는가?내 개발에 개인정보보호에 관한 지식이 even 하게 녹아들어 있는가?이러한 생각을 하니 저는 그만 자신을 잃어버리고 말았습니다.이런 저에게 KISIA(한국정보보호산업협회)에서 주관하는 '개인정보보호 기초 과정'에 참여할 수 있는 기회가 주어져 열심히 교육을 듣고 왔습니다.많은 개발자가 관련 교육이 없는 상태로 선배들의 발자국을 쫓아 개발을 이어나가고 있을 것입니다.사수가 없는 경우에는 더욱 막막하겠지요.이러한 분들에게 미약한 도움이 되어드리면 좋겠다는 생각에 교육 내용을 정리하여 공유하니 필요하신 분은 참고 부탁드립니다.만약 왜곡된 정보가 있다면 댓글로 알려주세요.빠르게 수정하겠습니다!주의사항:저는 법률.. 2024. 10. 16.
00님, 저희 페이지 검색해도 안 나오는데요?[5] (H tag 작성하는 법) 생각보다 사이트 제작 시 많은 사람들이 놓치는 부분이 H tag입니다.H tag는 SEO의 근본이라고 볼 수 있기 때문에 각 사이트와 페이지에 맞게 H tag를 올바르게 넣어줘야 합니다.H tag의 특징H tag의 H는 heading을 의미합니다.h1 ~ h6까지 있으며 구획 제목을 나타냅니다.H tag는 h1 ~ h6까지 있습니다.h1이 높고 h6이 낮습니다.가급적 내용의 순서와 중요도에 맞게 h1 다음에 h2, h2 다음에 h3을 적습니다.H1 태그는 한 페이지에 하나만 존재해야 합니다. 보통은 H1 태그 안에 logo를 넣은 뒤 H1 태그 클릭 시 Home으로 갈 수 있도록 합니다.이는 시각 장애인이나 다른 제한 사항이 있는 분들을 위해 대부분의 웹페이지에서 준수하는 웹 표준 규칙입니다. 웹 접근성.. 2024. 10. 14.
history를 사용해 앱처럼 뒤로가기 최근 업무 중에 재밌는 요청이 있었습니다.햄버거 메뉴나 검색 모달을 뒤로 가기 했을 때 모달 컨텐츠만 닫히고 페이지가 뒤로 가지 않았으면 좋겠다는 것이었습니다.여차저차 성공해서 뒤로가기 했을 때 페이지가 뒤로 가는 것이 아닌 모달 컨텐츠만 닫히도록 하였습니다.아래 코드의 진가는 모바일 제스쳐, 마우스 좌측의 뒤로 가기 버튼에 있습니다.모바일에서 제스쳐 뒤로 가기나 마우스로 뒤로 가기를 해도 페이지 이동이 아닌 모달 컨텐츠만 닫히는 것입니다!좀 더 앱 환경에 가까워진 것이죠.이 좋은 걸 저 혼자만 알 수 없어서 코드를 다듬어 왔습니다.아래 코드를 VS Code에서 라이브 서버로 보시면 한 눈에 이해하실 수 있습니다. call modal 2024. 10. 10.
00님, 저희 페이지 검색해도 안 나오는데요?[3] (robots.txt 작성하는 법) 방가링!다들 바쁘니까 바로 드갑시다.robots.txt 작성법#은 주석입니다.User-agent: *Allow: /blog/# /blog/ 경로 아래의 모든 페이지 크롤링 허용Disallow: /admin*# /admin으로 시작하는 모든 페이지 크롤링 금지Disallow: /login*# /login으로 시작하는 모든 페이지 크롤링 금지Sitemap: https://bellriver.co.kr/sitemap.xml# Published by # ██████╗ ███████╗██╗ ██╗ ██████╗ ██╗██╗ ██╗███████╗██████╗ # ██╔══██╗██╔════╝██║ ██║ ██╔══██╗██║██║ ██║██╔════╝██╔══.. 2024. 10. 4.
00님, 저희 페이지 검색해도 안 나오는데요?[2] (sitemap.xml 작성하는 법) 바쁘신 분들을 위해 작성법 먼저 보여드리겠습니다.sitemap.xml이 무엇인지, 주의 사항 등이 궁금하신 분들은 하단의 글을 참고 부탁드립니다.sitemap.xml 작성법sitemap.xml 파일은 텍스트 파일로 만든 후 확장자를 xml 파일로 저장하면 됩니다.(xml 파일 확장자로 저장 시 파일이 깨질 수 있다는 경고문이 나올 수 있습니다. 무시하고 저장하셔도 됩니다.)아래는 sitemap.xml 파일의 형식입니다. https://bellriver.co.kr https://bellriver.co.kr/blog 위 코드를 복사하신 후, 보이고 싶은 페이지를 표시하면 됩니다.표시한 페이지는 로봇들이 크롤링해서 필요한 정보를 가져가게 됩니다.(대외적으로 .. 2024. 9. 30.