기본적으로 브라우저에서 사용하는 알림(모달)창 alert()를 조금 예쁜 알림(모달)창으로 변경하는 방법에 대해서 알아보겠습니다. SweetAlert2입니다. 먼저 세팅하는 방법과 어떻게 사용하면 되는지 샘플로 확인해 보겠습니다. 생각보다 간단하게 설치가 가능하고, 여러 가지 기능들이 있어서 자주 사용하고 있습니다. SweetAlert2 설치하기SweetAlert2 웹사이트에서 'Download & install' 영역으로 이동합니다. 제가 주로 사용하는 방법은 CDN을 이용하고 있습니다. 아래 소스를 복사해서 사이에 붙여 넣기만 하시면 세팅 완료입니다.다른 방법으로는 jsDelivr CDN 웹사이트에서 js파일과 css파일을 제공하기도 합니다. SweetAlert2 기본 모달창 사용해 보기브라우저에..
기존에 사용하는 PHP 프로젝트에 리액트(React)를 빠르게 적용하는 방법을 알아보겠습니다. 이미 모든 파일이 PHP 파일로 사용 중이어서, 여기에 리액트(React)를 찾아보다가 CDN을 이용해 빠르게 적용하는 방법을 찾았습니다. 그 부분에 대해서 자세히 알아보겠습니다. HTML에 CDN 설정하기리액트(React)를 통해 사용하는 방법은 간단하고 빠르게 기존 프로젝트에 리액트(React)를 적용할 수 있는 방법입니다. 특히 작은 프로젝트나 간단한 프로젝트에 유용하다고 생각됩니다.먼저 HTML 위 예제 코드에서 // 파일명 : foot.php// 파일명 : main.php내용 상단 head.php, 하단 foot.php로 만든 다음 main.php에서 include를 사용해서 상..
기존에 PHP로 개발을 많이 하는 편이었는데, Vue를 접하면서 PHP를 백엔드로 하고 프론트엔드에 동적 기능을 개발하는 언어는 없을까 찾다가 리액트(React)를 알게 되면서, PHP와 리액트(React) 결합으로 개발하는 부분에 대해서 많이 알아보고 있는 중에 좋은 점을 공유하려고 합니다. 역할 분리백엔드와 프론트엔드의 역할 분리는 개발 효율성을 높이는 데 중요한 요소입니다.PHP : 데이터베이스 관리, 서버 사이드 로직 처리, 인증 및 권한 부여 등의 역할을 담당합니다. 백엔드에서 모든 비즈니스 로직을 처리하고, 클라이언트에 필요한 데이터를 API를 통해 제공합니다.리액트(React) : 사용자 인터페이스(UI)를 담당하며, API를 통해 백엔드에서 제공하는 데이터를 받아 화면에 렌더링 합니다. U..
이번 시간에는 리액트(React)로 웹 서비스 개발할 때의 장점을 알아보고, 특히 리액트(React)를 이용해서 어떤 유형의 웹 서비스를 개발하면 좋은지에 대해서 알아보도록 하겠습니다. 리액트의 장점빠른 렌더링 성능 : 가상 DOM을 사용하여 변경된 부분만 업데이트하기 때문에 빠른 렌더링 성능을 제공합니다.재사용 가능한 컴포넌트 : UI를 독립적인 컴포넌트 단위로 구성할 수 있어 코드의 재사용성과 유지보수가 용이합니다.커뮤니티 지원 : 리액트(React)는 강력한 커뮤니티를 가지고 있어, 다양한 라이브러리와 도구들을 활용할 수 있습니다.단방향 데이터 흐름 : 데이터 예측이 가능하고 쉽게 관리할 수 있도록 단반향 데이터 바인딩을 사용합니다.JSX : HTML과 JavaScript를 혼합 아여 작성할 수 있..
리액트(React)는 페이스북에서 개발한 오픈 소스 자바스크립트(JavaScript) 라이브러리입니다. 사용자 UI를 구축하는 데 유용하게 사용되고 있습니다. 이번 시간은 리액트(React)에 대해서 알아보겠습니다. 리액트(React)의 특징컴포넌트 기분 구조 : 재사용이 가능한 컴포넌트 UI로 구성되어 있습니다. 각 컴포넌트는 독립적이며, 다른 컴포넌트들과 조합하여 복잡한 UI를 만들 수 있습니다.가상 DOM : 가상 DOM(Virtual DOM)을 사용하여 실제 DOM을 최소한으로 업데이트합니다. 이는 성능을 크게 향상하고 빠른 업데이트가 가능하게 합니다.단방향 데이터 흐름 : 단방향 데이터 바인딩을 사용하여 데이터의 흐름을 예측하게 합니다. 애플리케이션의 상태 관리와 디버깅을 쉽고 편하게 해 줍니다..
Mysql 풀텍스트 인덱스(FullText Index)는 텍스트 검색 시 사용하는 방법입니다. 풀텍스트 인덱스(FullText Index) 를 사용하기 위해서는 몇 가지 조건이 필요합니다. 해당 칼럼의 데이터형식이 CHAR, VARCHAR, TEXT일 때만 사용할 수 있습니다. 예제를 통해 사용법을 알아 보도겠습니다. 풀텍스트 인덱스(FullText Index) 사용하기풀텍스트 인덱스(FullText Index)를 사용하기 위해서는 먼저 텍스트 검색을 할 컬럼을 정해야 합니다. 해당 칼럼의 데이터형식이 CHAR, VARCHAR, TEXT 여야 하고, Mysql InnoDB 또는 MyISAM 데이터베이스 엔진을 사용해야 합니다. 이 조건에 맞다면 해당 칼럼에 풀텍스트 인덱스(FullText Index)..
첫 번째. 깜빡이는 글자(Text) .blinkText { -webkit-animation:blink .2s ease-in-out infinite alternate; /* Safari 4+ */ -moz-animation:blink .2s ease-in-out infinite alternate; /* Fx 5+ */ animation:blink .2s ease-in-out infinite alternate; /* IE 10+, Fx 29+ */ } @-webkit-keyframes blink { 0% {opacity:0} 100% {opacity:1} } @-moz-keyframes blink { 0% {opacity:0} 100% {opacity:1} } @keyframes blink { 0% {opa..
JDK ECLIPSE WAS DBMS HTML JAVASCRIPT KENDO UI WEB JAVA 콘트롤러 서비스 서비스 임팩트(?) 맵퍼 이게 뭘까? 어떻게 해야하지? PHP와 엄청 다르다. 내가 잘 할 수 있을까?
아이린소프트가 이번에 리뉴얼 되었습니다.부트스트랩을 이용한 심플한 레이아웃에 반응형 웹까지 적용되었네요~ 아이린소프트가 하는 일1. 독립형 쇼핑몰 제작 (영카트5 솔루션)2. 모바일 쇼핑몰 제작 (영카트5 솔루션)3. 고도몰 독립형 커스텀4. 운영중인 쇼핑몰 커스텀 (PHP로 제작된 독립형 쇼핑몰)5. 사내 ERP 제작 (건축회사,PC방,대형식당,물류창고)6. 모바일 앱 제작 (안드로이드, 애플 IOS )이렇게나 많은 일들을 하고 있네요~ ^^ 주로 영카트를 이용한 독립형 쇼핑몰 제작을 한거 같은데, 이번에 새롭게 ERP와 모바일 앱이 추가 되었네요! 점점 회사 규모가 커져가는거 같네요~www.eileensoft.com
window.opwn 사용시새창에서 중앙정렬$(function() { var sw = screen.width; var sh = screen.height; var cw = document.body.clientWidth; var ch = document.body.clientHeight; var top = sh / 2 - ch / 2 - 100; var left = sw / 2 - cw / 2; moveTo(left, top);});
