웹솔루션개발 26년 노하우! 해피CGI의 모든것

히어로 영역에서 마우스 스크롤을 하면 가로로 이동합니다.3D 형태로 회전/배치되는 효과가 있습니다.첨부파일을 다운로드 받거나 해당 사이트에서 html, css 전체 소스를 확인할 수 있습니다.

구인구직 사이트는 채용공고를 올리는 게시판만 만든다고 완성되지 않습니다. 기업은 적합한 인재를 빠르게 찾고 싶어 하고, 구직자는 믿을 수 있는 공고를 편리하게 검색하고 지원하길 원합니다. 서로 다른 두 이용자의 흐름이 자연스럽게 연결되어야 실제로 운영되는 플랫폼이 됩니다. 구인구직 사이트 제작을 준비한다면 디자인보다 먼저 서비스 구조와 운영 방법부터 정리해야 합니다. 1. 누구를 연결할지 먼저 정하기가장 먼저 결정할 것은 사이트의 대상입니다. 전국 단위 종합채용 사이트인지, 특정 지역 일자리 사이트인지, 의료·패션·운전·교육처럼 한 업종에 집중할 것인지에 따라 필요한 검색 조건과 콘텐츠가 달라집니다. 주요 이용자의 연령대, 모바일 사용 비중, 채용 형태, 공고 등록 주체도 함께 정리해 보세요. 타깃이 선..

다양한 모달 팝업 효과 입니다.버튼 클릭시 애니메이션 효과를 바로 확인할 수 있습니다.효과별 css 를 찾아서 원하는 효과를 찾아 사용이 가능합니다.첨부된 파일을 다운로드 하거나 해당 사이트에서 전체 모달 효과에 대한 소스를 확인할 수 있습니다.

여러 이미지를 3×3 형태의 벤토 그리드로 배치하고, 사용자가 특정 이미지를 가리키면 해당 행과 열의 비율이 변경되도록 구성된 인터랙션 예제입니다.GSAP의 Flip 플러그인을 활용해 레이아웃이 바뀌는 과정이 끊기지 않고 부드러운 애니메이션으로 표현됩니다.선택된 이미지 영역이 커지면서 주변 이미지들은 자연스럽게 축소·재배치되어 사용자의 시선을 집중시키는 효과를 줍니다.단순한 이미지 확대가 아니라 그리드 전체 구조가 함께 변화하기 때문에 일반 갤러리보다 역동적인 화면 구성이 가능합니다.포트폴리오, 브랜드 이미지 쇼케이스, 작품 갤러리, 제품 비주얼 소개 영역 등에 활용하기 좋은 인터랙션 방식입니다.HTML 구조 https://assets.codepen.io/16327/portrait-image-1..

온라인 교육을 운영하다 보면 강의 영상보다 관리해야 할 일이 더 많다는 것을 느끼게 됩니다. 누가 어떤 과정을 듣는지, 학습은 어디까지 진행됐는지, 과제와 평가는 제출했는지, 수료 대상자는 누구인지까지 살펴야 하기 때문입니다. 강의와 학습 정보를 여러 곳에 나눠 관리하면 확인할 항목이 늘고 업무도 반복됩니다.교육 운영을 연결하는 학습관리시스템, LMSLMS는 Learning Management System의 약자로, 학습자의 교육 활동을 지원하고 관리하는 시스템입니다. 강의를 보여주는 데서 그치지 않고 과정 등록, 수강생 관리, 학습 이력, 평가·과제, 수료 관리까지 교육 운영에 필요한 업무를 연결합니다. 해피 LMS 환급형 웹솔루션는 이러한 업무를 하나의 시스템에서 다룰 수 있도록 구성된 웹솔루션입니다..

React 기반으로 제작된 이미지 갤러리 예제로, 이미지 간 전환 과정에 시각적인 모프 효과를 적용한 것이 특징입니다.화면 좌우의 이전·다음 버튼을 통해 이미지를 순차적으로 전환할 수 있으며, 하단 썸네일을 선택해 원하는 이미지로 바로 이동할 수도 있습니다.모바일 화면에서는 썸네일 영역을 숨기고 좌우 탐색 버튼을 유지하는 방식으로 반응형 처리되어 있습니다.포트폴리오, 제품 이미지, 사진 전시 등 이미지 중심의 웹페이지에서 활용하기 좋은 갤러리 입니다.HTML 구조CSS 소스.root { width: 100%; height: 100dvh; overflow: hidden;} .root > div { width: 100%; height: 100%;} .stage { position: relative..

안녕하세요 해피CGI 입니다.해피 인터넷뉴스 웹솔루션 Ver4.2 스킨K가 출시 되었습니다.자세한 사항은 아래의 내용을 참고하시기 바랍니다.

Linda는 웹브라우저 내부에서 직접 실행되는 오픈소스 AI 에이전트 SDK입니다.별도의 브라우저 자동화 서버 없이 기존 웹페이지에 JavaScript 형태로 추가하여 AI 기능을 적용할 수 있습니다.현재 페이지의 DOM 구조를 AI가 이해할 수 있는 가상 파일 시스템(VFS) 형태로 제공하며, AI가 페이지의 입력폼을 채우거나 필요한 데이터를 읽고 사용자와 대화하면서 작업을 수행할 수 있습니다. 일반적인 챗봇처럼 답변만 제공하는 방식이 아니라 실제 웹페이지의 요소와 연동하여 동작하는 것이 특징입니다.Anthropic Claude, OpenAI, Groq, OpenRouter, Ollama 등 다양한 AI 모델을 지원하며특정 AI 서비스에 종속되지 않고 사용할 수 있습니다. React 등 특정 프레임워크..

Files SDK는 여러 종류의 오브젝트 스토리지와 파일 저장 서비스를 하나의 통일된 인터페이스로 사용할 수 있도록 해주는 오픈소스 SDK입니다.https://files-sdk.dev/Amazon S3, Cloudflare R2, Google Cloud Storage, Azure Blob Storage, MinIO, Vercel Blob, Supabase, Google Drive, OneDrive, Dropbox, Box 등을 포함해 40개 이상의 스토리지 어댑터를 지원합니다. 저장소를 변경하더라도 애플리케이션의 파일 처리 코드를 대부분 그대로 유지할 수 있는 것이 특징입니다. 파일 업로드, 다운로드, 목록 조회, 존재 여부 확인, 복사, 이동, 삭제 등의 기본 기능을 동일한 API로 사용할 수 있으며..

인터넷신문 창간을 준비할 때 가장 궁금한 부분은 “얼마가 필요하고 무엇부터 해야 할까?”입니다. 일반 홈페이지와 달리 기사 작성·편집·검색·기자 관리 기능이 필요하고, 언론사로 활동하려면 행정 등록과 운영 기준도 챙겨야 합니다. 비용, 제호, 도메인, 콘텐츠 계획을 함께 정리해야 시행착오를 줄일 수 있습니다. 인터넷신문 창간 비용은 어떻게 구성될까?창간 비용은 초기 구축비와 정기 운영비로 나뉩니다. 초기 비용에는 솔루션 설치, 메인 디자인, 메뉴·기사 카테고리 구성, 모바일 세팅 등이 포함됩니다. 운영비에는 호스팅, 유지보수, 도메인 갱신, 추가 용량과 트래픽이 들어갑니다. 고급 디자인이나 데이터 이전, 외부 서비스 연동은 별도 비용이 될 수 있습니다. 예를 들어 2026년 10월 NEWSRENT ..