본문 바로가기
반응형

만들기9

G메일 SMTP를 이용해서 메일 자동 발송하기 - php 환경 G메일 SMTP를 이용해서 메일 자동 발송하기 - php 환경 "상담 게시글이 올라오면, 담당자에게 자동으로 알림 메일이 가도록 해주세요!" 라는 요구사항을 만나고 이 글까지 오셨다면, 초보 개발자분 이거나 혹은 마케터 혹은 개발자가 아닌 분들이 대부분이실 것 같습니다. 이미 자동메일 발송에 대한 개발을 경험한 시니어 개발자분들은 충분한 솔루션을 가지고 있거든요. 상담 게시글이 올라간다는 것은 DB의 특정 테이블에 새로운 행이 Insert 된다는 이야기니까, 웹사이트의 코드를 가만히 따라가보면 분명히 상담을 DB에 인서트 해주는 부분이 있을 겁니다. DB업데이트를 해주는 코드 이후로 메일 발송 코드를 작성해주면 되는 것이겠죠? 참고로 이 과정을 얼마 전에 Make 같은 노코딩 툴로도 진행을 해보았었는데요.. 2025. 5. 9.
Hover 버튼을 폼 나게 만들기 (transition + transform 적용) Hover 버튼을 폼 나게 만들기 (transition + transform 적용) 이전 포스팅에서 transition과 transform에 대해서 정리하고 살펴보았습니다. 공부한 건 바로 써먹어 봐야겠죠? 웹 사이트에서 매우 흔하게 볼 수 있는 hover에 반응하는 hover(호버) 버튼을 만들어보려고 합니다. 한국에서는 롤오버 버튼이라고도 많이 불리는 것 같습니다. 실무에서는 대체적으로 hover button 혹은 roll-over button의 경우 적용된 폰트의 색상이나 백그라운드 컬러 정도를 변하게 하는 형태를 주로 사용하게 되는데요, 이번 포스팅에서는 좀 더 과감하게, transition과 transform 속성을 이용하여 만들어보면서 공부해보는 시간을 가져보도록 하겠습니다. 예제코드 아래 예.. 2023. 4. 3.
float를 이용한 탭 메뉴 버튼 만들기2 - jQuery, vanilla JS 구현 float를 이용한 탭 메뉴 버튼 만들기2 - jQuery, vanilla JS 구현 이전 포스팅에서 HTML/CSS를 이용해서 탭메뉴 버튼의 UI를 만들어보았습니다. float를 이용한 탭 메뉴 버튼 만들기 - Part 1 float를 이용한 탭 메뉴 버튼 만들기 - Part 1 float를 이용한 탭 메뉴 버튼 만들기 - Part 1 HTML/CSS를 이용해서 Tab Menu 버튼을 만들어 봅시다. 바로 이런 거요. 쇼핑몰 상품설명 상세페이지에서 흔히 볼수 있는 형태입니다. 저의 입장에서라면 사 kincoding.com 그러면 이제 이 메뉴를 동적으로 작동하도록 만들어야겠죠? 그런 역할을 해주는 언어가 바로 Javascript입니다. 프로그래밍 언어를 이용하는 코딩은 흥미진진합니다. 생명력을 불어 넣.. 2023. 2. 13.
float를 이용한 탭 메뉴 버튼 만들기 - Part 1 float를 이용한 탭 메뉴 버튼 만들기 - Part 1 HTML/CSS를 이용해서 Tab Menu 버튼을 만들어 봅시다. 바로 이런 거요. 쇼핑몰 상품설명 상세페이지에서 흔히 볼수 있는 형태입니다. 저의 입장에서라면 사실 flex를 이용하는 게, 익숙치 않은 float를 사용하는 것보다 훨씬 더 직관적이고 쉬울듯 하지 않을까라는 생각이 들기도 하지만, 다른 사람이 만들어 놓은 결과물을 수정해야 하는 경우도 있으니, 이 참에 먼저 float를 이용하여 만든 탭 메뉴에 익숙해질 수 있도록 포스팅을 통해 정리를 합니다. html 뼈대 구성 뼈대가 되는 html은 다음과 같이 ul, li를 이용해서 메뉴 형식으로 구성했습니다. 하단 각각의 div는 각 탭을 눌렀을 경우에 보여주거나 숨길 설명 내용입니다. 물론.. 2023. 2. 12.
반응형