• webmini life skin
    50% sale     Ver 1.4.1 update view
  • 사이트 제작 문의 오랜 경험을 바탕으로 웹퍼블리싱을 해드립니다 제작 문의하기
  • 블로그 리뷰 문의 검색엔진최적화로 제품 리뷰를 해드립니다 리뷰 문의하기

전체보기868

728x90
[여행]거제도 여행, 바람의 언덕 도장포 유람선에서 외도 보타니아 가기 두 번째 거제도 여행이다.10년 전쯤으로 기억하는데 그때는 날씨가 좋지 않아 외도 보타니아를 가보질 못해서 아쉬웠었다. 최우선적으로 외도를 가보자는 생각으로 일정을 잡았다. 어차피 '바람의 언덕'을 가야 하는 일정이 있었기에, 외도를 가는 여러 방법 중에서 우리는 '바람의 언덕' 도장포 유람선을 선택하게 되었다.주차장에 바로 도장포 매표소가 있으며, 주차는 그곳에 하면된다. (유람선 탑승객에 한함)  가격은 성인기준 1인당 입장료(11,000원) + 유람선(23,000원) = 34,000원 정도 했다.(참고로 외도에 상륙하지 않고, 유람선으로만 관광하실 거면 1코스 유람선만 지불하면 된다.)개인적으로 2코스 외도 관광까지 추천한다.출항시간대는 고정시간이 아니라서 미리 알아봐야 한다. 시간이 맞지 않을 경..
[Mac]맥에서 영문 첫글자 대문자로 변경 안되게 하기 맥에서 메모하다 보면 영문 첫글자가 대문자로 자동으로 변경될때가 있습니다.그럴경우 아래에서 설정을 변경해주면 됩니다. 시스템 설정 > 키보드 > 텍스트 입력 (입력소스 편집) '자동으로 단어를 대문자로 시작' 체크 해제 체크해제를 하면 첫글자가 대문자로 자동 변경되지 않습니다.
[React]npm과 yarn이란? react는 페이스북(Facebook, 현재 메타 Platforms)의 소프트웨어 엔지니어였던 **조던 워크(Jordan Walke)**가 개발했습니다. 그는 2011년에 React의 초기 버전을 만들었으며, 이는 Facebook에서 내부적으로 사용되던 XHP라는 PHP 기반 라이브러리에서 영감을 받았습니다.React는 처음에는 Facebook의 뉴스피드와 Instagram에 사용되었으며, 2013년에 오픈 소스로 공개되었습니다. 공개된 이후로 React는 웹 개발 커뮤니티에서 큰 인기를 얻었고, 현재는 전 세계적으로 가장 널리 사용되는 프론트엔드 라이브러리 중 하나로 자리 잡았습니다. 리액트를 사용하려면 npm or yarn을 통해 라이브러리를 내려받아야합니다. npm(Node Package Manag..
[Javascript]HTMLCollection과 querySelector의 차이 HTMLCollection과 querySelector (또는 querySelectorAll)의 차이는 주로 반환 객체의 형태, 동작 방식, 사용 사례에 있습니다. 이를 아래에서 자세히 비교합니다.1. 반환 객체의 차이메서드getElementsByClassName, getElementsByTagName, 등querySelector, querySelectorAll반환 객체HTMLCollectionElement 또는 NodeList실시간 업데이트문서가 변경되면 자동 업데이트문서가 변경되어도 업데이트되지 않음다중 요소 선택항상 여러 요소를 반환 (HTMLCollection)querySelector: 첫 번째 요소만 반환 querySelectorAll: NodeList로 모든 요소 반환예시// HTML 구조Ite..
[Javascript]HTMLCollection을 반환하는 주요 DOM 메서드 HTMLCollection을 반환하는 주요 DOM 메서드document.getElementsByTagName(tagName)특정 태그 이름을 가진 모든 요소를 선택합니다.예: document.getElementsByTagName('div')→ 태그를 모두 포함하는 HTMLCollection 반환.document.getElementsByClassName(className)특정 클래스를 가진 모든 요소를 선택합니다.예: document.getElementsByClassName('item')→ 클래스가 item인 모든 요소를 포함하는 HTMLCollection 반환.document.forms현재 문서의 모든 요소를 선택합니다.예: document.forms→ 문서의 모든 태그를 포함하는 HTMLColle..
[Javascript]DOM Script 이벤트와 선택자 이벤트HTML DOM에서 지원하는 스크립트 이벤트 종류는 웹 페이지에서 다양한 사용자 상호작용과 브라우저 동작을 처리하기 위해 사용됩니다. 주요 이벤트는 다음과 같은 그룹으로 나눌 수 있습니다.1. 마우스 이벤트onclick: 요소를 클릭했을 때 발생ondblclick: 요소를 더블 클릭했을 때 발생onmousedown: 마우스 버튼을 눌렀을 때 발생onmouseup: 마우스 버튼을 뗐을 때 발생onmousemove: 마우스가 요소 위에서 움직일 때 발생onmouseover: 마우스가 요소 위로 들어갈 때 발생onmouseout: 마우스가 요소를 벗어날 때 발생onmouseenter: 마우스가 요소 위로 들어갈 때 (버블링 없음)onmouseleave: 마우스가 요소를 벗어날 때 (버블링 없음)Click..
[운영일지]웹미니 라이프 스킨 1.4.1 버전 : webmini life 1.4.1업데이트 내역- 본문내 이전글/다음글 추가- '응원하기' 다크모드 지원  본문내에 이전글/다음글이 추가되었으며, 스킨편집에서 노출 설정이 가능합니다.관련글도 노출 설정이 스킨편집에서 가능하도록 수정되었습니다. '응원하기' 노출이 되는 블로그는 다크모드에서도 지원하도록 수정되었습니다.주의할점index.xml을 덮을경우 기존에 설정된 값들이 없어지므로 스킨편집 설정창을 새로 하나더 열어서 업로드하시고 기존 설정창에서 아무거나 수정 후 적용을 누르시면 기존 설정들이 다시 저장됩니다. 그후에 새로추가된 기능을 재설정하시면 됩니다. 스킨 구매하기
[운영일지]웹미니 라이프 스킨 1.3.4(패치) 버전 : webmini life 1.3.4업데이트 내역- 버전표기 오류 수정 (index.xml,  style.css)- 제목 그라데이션 설정 오류 수정 스킨편집에서 '제목 그라데이션 사용' 사용안할시 그라데이션 제거 되지 않은 문제 수정 기존 사용자는 아래 내용찾으셔서 해당 스타일 삭제해주세요. style.css.post-cover h2 { margin: 0 auto; font-weight: 600; font-size: 22px; line-height: 1.4; color: var(--defaultText); letter-spacing: -0.01em; overflow: hidden; background: linear-gradient(90deg, #8980ed..
[Javascript]많이 사용되고 유용한 JavaScript 라이브러리와 프레임워크 웹사이트에서 많이 사용되고 유용한 JavaScript 라이브러리들은 다양한 기능을 제공하며, 웹 개발을 더욱 효율적이고 편리하게 만들어 줍니다. 여기 몇 가지 인기 있고 유용한 JavaScript 라이브러리와 프레임워크를 소개합니다1. React용도: UI 구축설명: React는 Facebook에서 개발한 사용자 인터페이스(UI) 라이브러리입니다. 컴포넌트 기반 아키텍처를 사용하여 효율적으로 복잡한 UI를 관리할 수 있습니다. React는 Virtual DOM을 사용하여 성능 최적화와 빠른 렌더링을 제공합니다.추천 이유: 현대 웹 애플리케이션에서 가장 인기 있는 라이브러리로, 대규모 애플리케이션에 적합하고 많은 커뮤니티와 리소스가 존재합니다.링크: https://reactjs.org/ ReactReact..
[영화]25년전의 재미와 감동 그대로 글래디에이터2 관람 후기 바야흐로 글래디에이터 1을 본 게 군대시절이었다...이등병 때 1일 정비를 얻어서 눈치 보면서 본 기억이 난다. 군대 제대 후 집중해서 다시보긴 했는데, 명작으로 기억이 남았던 영화이다. 1편이 너무 명작이기에 2탄이 잘해봐야 본적이겠지라는 10%로의 생각을 갖고 영화를 관람하게 되었다.느낌은 1편과 비슷하면서 (초반 지루함도 비슷) 집중을 할 수밖에 없는 스토리와 분위기. 간단히 요약하자면 1편과 연결이 되고 주인공인 '막스무스'의 아들이 2편의 주인공이다.1편에 나왔던 꼬맹이가 2편에서는 주인공이며 아들이다. 솔솔히 재밌고 약간의 감동도 있다.개인적으로는 2편도 훌륭했으며, 1편을 안 본 사람도 2편을 보고 재밌어서 1편까지 찾아보게 되는 경우를 보았다. 런타임이 1탄과 비슷하게 좀 긴편이다.지금 이..
웹미니 스킨 블로그 등록 웹미니 스킨 구매를 해주신 분들은 이곳에 아래 양식에 맞춰 사용하시는 블로그 주소를 남겨주셔야 합니다.(비밀댓글로 남겨주세요) 등록 양식- 스킨명 : ex) 웹미니 라이프- 블로그 주소 : https://- 블로그 주소변경 : (변경이 있을경우만 해당)- 사용후기 등록 허락 : O or X 만약 블로그 주소가 변경되었다면, 기입해주세요. (구매는 1개의 블로그 기준입니다.)그리고 스킨 사용후기에 소개를 해드리고자 하는데 원하시면 O, 원치 않으시면 X라고 표기해 주시면 됩니다.  웹미니 스킨 구매를 해주셔서 감사드립니다.^^
[운영일지]웹미니 라이프 스킨 1.3.3 webmini life 1.3.3업데이트 내역- 본문글자크기 조절기능 추가 스킨편집에서 '본문 폰트사이즈 확대/축소' 기능을 설정할 수 있습니다.  화면크기 기능과 다르게 본문글자 기능은 본문에 글자 크기만 제어합니다. 기존 사용자중에 스킨을 수정해서 덮어씌우기가 어려울경우는 아래 코드를 추가해주시면 됩니다. script.js// 본문 글자크기조절코드// 본문 글자크기조절 end 위 주석을 찾아  안에 코드를 복사 후 넣어주세요. skin.html// 아래 코드를 찾으신 후본문 집중모드// 아래 코드로 변경합니다. 본문 집중모드 본문글자  style.css.post-cover .option_box { ..
[CSS]css 최신문법에서 추가되는 기능과 설명, 호환성 여부 CSS 기능 중 주목할 만한 몇 가지와 그 설명들입니다.브라우저에서 지원가능한 시기에는 구지 SASS를 사용할 필요가 없는 날이 오겠네요. 1. CSS Nesting설명:Sass와 같은 CSS 전처리기에서 제공되던 네스팅(Nesting) 기능이 이제 CSS 표준으로 도입되고 있습니다. 사용법:.container { color: black; .child { color: red; }} 장점: 코드를 더 간결하게 작성할 수 있고 구조적으로 이해하기 쉬움. 지원 여부:Chrome: 부분 지원 (플래그 설정 필요)Firefox: 미지원 (개발 중)Safari: 미지원 (예정)Edge: Chrome 기반으로 부분 지원호환성 팁: Sass 또는 PostCSS 같은 전처리기를 활용해 네스팅을 사용 가능. 2..
[정보]구리시에서 자동차 번호판을 변경하려면? 요점만 간단히 설명드리겠습니다.구리시 자동차 번호판 교부소를 방문합니다.기존에는 구리시청 입구 옆쪽에 있었지만, 이전을 해서 구리시청 안쪽으로 들어가서 우측 길따라 맨위쪽으로 끝까지 올라가면 나가는길 전에 위치해있습니다.  기존 번호를 유지하면서 번호판만 변경하려면 35,000원에 비용이 발생하며 10~20분이면 됩니다.만약 번호까지 변경하려면 자동차 교부소에서 변경신청을 하시고, 번호판 교부소에 가서 새로운 번호판을 장착해야합니다.만약 앞자리 3자리면 필름식 번호판과 사이즈가 동일해서 번호판 가드를 그대로 사용해도 됩니다만, 앞자리가 2자리인데 3자리로 변경시에는 사이즈가 달라 보조판 비용까지 듭니다. (보조판 10,000원 / 탈부착 3,000원) 준비물자동차 등록증신분증(여권, 주민등록증, 운전면허..
[영화]'보통의 가족' 인간의 죄의식과 양면성 영화의 제목을 보고 내용을 짐작할 수 있다.우리는 뭐가 옳고 그른지 교육과 학습을 통해 익숙해져 있다. 포괄적으로 도덕과 양심이라고 말할 수 있겠다. '보통의 가족'은 인간의 내면적인 모습을 전달하고 있다.포스터에서도 인간의 양면성을 암시하고 있다. 겉으론 나쁜사람처럼 보여도 그렇지 않은 사람이 있고, 봉사활동과 어려운 사람을 돕지만 본인과 직접 연관될 경우 또다른 모습을 보여주는 사람등등 형(설경구)와 동생(장동건)은 처음과 마지막이 서로 입장이 바뀌어 생각을 하게 된다. 과연 우리가 알고 있는 도덕과 양심은 학습을 통해 교육이 된것일까..아니면 인간이란 존재는 태어날때부터 이러한 감정이 탑재되어있는것일까.. 관객들도 '나는 저런 상황에서 저렇게 했을거야', '저건 도덕적으로 저렇게 하면 안되지' 등 ..
[운영일지]웹미니 라이프 스킨 1.3.2 webmini life 1.3.2업데이트 내역- 불필요한 코드 삭제 (skin.html / script.js)- 알림팝업 버튼 및 글영역내 버튼(.btn_buy) 애니메이션 효과 추가 스킨 구매하기
[Javascript]반복문의 종류와 사용 용도 JavaScript에서 for...of, for...in, forEach, map, filter, reduce는 모두 반복문이지만, 각기 다른 용도와 특성을 가지고 있습니다. 특정 상황에 맞는 반복문을 선택하는 것이 중요합니다. 아래에 각 반복문의 사용 용도와 차이점을 설명하겠습니다.1. for...of용도: 배열, 문자열, Map, Set 등의 iterable 객체의 값을 순회할 때 사용.언제 사용해야 할까?배열이나 iterable 객체의 요소 값을 순회할 때 가장 유연하게 사용 가능.요소의 순서대로 값을 읽어오는 작업에 적합.중간에 break 또는 continue로 반복을 중단하거나 건너뛰고 싶을 때 사용.const arr = [1, 2, 3];for (const value of arr) { con..
[Mac]Mac OS Sequoia 15.0 아이폰 미러링 지원 Mac OS Sequoia 으로 업데이트 되면서 아이폰 미러링 기능을 드디어 지원하게 되었다. 그동안 애플 사용자들이 원했던 기능인데 그로인해 사용하기가 더욱더 편리해졌다. 먼저 아이폰의 어플들을 맥에서도 이용하기 때문에 게임뿐만아니라, 인증 받아야할 경우 아이폰을 보고 확인을 해던것들이 맥에서 손쉽게 인증을 할수 있게 되었다. 업데이트 되면서 단점과 아직 다른 프로그램과 충돌(?)문제도 있고 버그가 아직 있다는 의견들이 있는데, 개선되리라 생각되고 그에 맞게 다른 소프트들도 빌드업하리라 생각된다.주요 업데이트 기능:iPhone 미러링: 맥에서 아이폰을 바로 제어하고 사용할 수 있습니다.Apple Intelligence: 인공지능 기반 도구가 도입되어, 문서 작성 시 자동 교정, 요약, 톤 변경 등을 지..
[나스]시놀로지 NAS에 웹서버 구축하기 6탄(도메인 접속시 다른 사이트로 리다이렉팅 시키기 .htaccess 이용) 시놀로지 NAS에 웹서버 구축하기 6탄 - 도메인 연결시 다른 사이트로 리다이렉팅 시키는 방법입니다. 이해를 돕고자 아래 url로 접속해보면 알수 있습니다.https://www.webmini.co.kr 위 주소로 접속시 https://webmini.tistory.com 으로 라다이렉팅 되는 걸 알수 있습니다.물론 도메인 제공업체에서 설정하는 여러 방법들도 있겠지만, 저는 시놀로지 NAS 웹서버를 통해 .htaccess 파일을 이용해서 리다이렉팅을 하고자 합니다. 먼저 도메인 업체에서 DNS레코드 설정을 하셔야합니다.본인이 구매하신 도메인 업체 사이트에 접속해서 DNS레코드 > A레코드 설정을 해주세요. (사이트마다 조금씩 다릅니다.)예를 들어 webmini.net 이나 www.webmini.net 로 접..
[CSS]버튼이나 링크에 애니메이션 제공해주는 라이브러리 버튼이나 링크에 마우스를 올렸을 때 적용할 수 있는 여러 애니메이션 효과를 제공하는 라이브러리입니다. 다양한 버튼 애니메이션을 구현해주며, 버튼 제작시 참고용으로도 괜찮은거 같습니다.https://ianlunn.github.io/Hover/ Hover.css - A collection of CSS3 powered hover effects ianlunn.github.io설치방법사용하려면 먼저 라이브러리를 포함시켜야 합니다. 두 가지 방법으로 사용할 수 있습니다:(1) CDN으로 포함하기HTML 파일의  (2) 직접 다운로드하여 사용하기https://github.com/IanLunn/Hover 에서 파일을 다운로드합니다.프로젝트에 hover.css 파일을 포함시킵니다.HTML 파일에 해당 CSS 파일을 링크..
반응형