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

2024/099

728x90
[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 파일을 링크..
[AI]카카오톡으로 chat GPT 가져오기 (메신저봇 사용) - 개선된 버전 기존 버전에서 개선된 버전입니다. https://webmini.tistory.com/1080 (기존버전) [AI]카카오톡으로 chat GPT 가져오기 (메신저봇 사용)요새 chat GPT가 대세죠.현재는 GPT를 통해 다양하게 이용중인데요. 저역시 업무간에 코드오류 체크, 생성등 너무 효율적으로 잘사용하고 있습니다. GPT란GPT는 "Generative Pre-trained Transformer"의 약webmini.tistory.com셋팅 방법은 위에 게시글을 참고해주시고, 코드만 아래 내용으로 변경하시면 됩니다.개선된 코드const scriptName = "GPT";let key = "API 입력"; // OpenAI 사이트에서 발급받은 API 키 입력function response(room, msg,..
[Javascript]비동기 처리 Promise, async/await 살펴보기 javascript에서 비동기 처리를 다루는 방법으로는 Promise와 async/await이 있습니다. 이 두 가지 방법은 비동기 작업(예: API 호출, 파일 읽기 등)을 처리하는 데 매우 유용합니다.1. Promise 예제Promise는 비동기 작업이 성공했는지 실패했는지에 따라 결과를 처리할 수 있는 객체입니다.// 비동기 작업을 시뮬레이션하는 Promise 생성const fetchData = () => { return new Promise((resolve, reject) => { setTimeout(() => { const success = true; // 작업이 성공했다고 가정 if (success) { re..
[Javascript]고차함수, 익명함수, 콜백함수 설명 및 예제 1. 고차 함수 (Higher-Order Function)고차 함수는 하나 이상의 함수를 인수로 받거나, 함수를 반환하는 함수입니다.// 고차 함수: 함수를 인수로 받음function higherOrderFunction(callback) { console.log("고차 함수가 호출되었습니다."); callback(); // 전달받은 함수를 호출}// 인수로 전달될 함수 (익명 함수 형태로 작성)higherOrderFunction(function() { console.log("이 함수는 콜백 함수로 전달되었습니다.");}); 고차 함수는 함수를 인수로 받아 호출합니다.2. 익명 함수 (Anonymous Function)익명 함수는 이름이 없는 함수로, 변수에 할당하거나 다른 함수에 전달될..
[React]리액트 기본 폴더 구조(SCSS포함) React 애플리케이션의 폴더 구조는 프로젝트의 복잡도와 팀의 선호도에 따라 다를 수 있습니다. 1.기본 폴더 구조my-react-app/│├── public/ # 정적 파일 (HTML, 이미지, 아이콘 등)│ ├── index.html # 기본 HTML 파일│ └── ...│├── src/ # 소스 코드 폴더│ ├── assets/ # 이미지, 폰트, CSS 파일 등│ ├── components/ # 재사용 가능한 컴포넌트│ ├── hooks/ # 커스텀 훅│ ├── pages/ # 페이지 컴포넌트│ ├── services/ # API 요청, ..
[React]리액트 설치 및 프로젝트 진행 과정 개발 환경 설정node.js 가 설치되어있는지 확인합니다.node -vnpm -v 설치가 안되어있다면 node.js 공식사이트에서 설치합니다.https://nodejs.org/en Node.js — Run JavaScript EverywhereNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org Node.js를 설치하면 npm(Node Package Manager)도 함께 설치됩니다. React 프로젝트 생성Create React App 사용Create React App은 React 프로젝트를 쉽게 시작할 수 있도록 도와주는 도구입니다.터미널을 열고, 프로젝트를 생성할 디렉토리로 이동합니다.다음 명령어를 입력하..
반응형