개요mac os에서 homebrew를 사용해 특정 php 버전을 설치하는 방법설치 가능한 php 버전 목록명령어brew install php@8.3 # Ex) 8.3버전 설치php -v # php 설치 확인트러블 슈팅위 명령어로 간단히 php를 설치했는데 php -v 명령어를 사용하면 php가 설치되지 않았다고 나왔다.해결방법내가 설치한 버전의 php를 기본으로 링크해주는 과정이 필요했다.brew link php@8.3 # Ex) php 8.3버전 기본으로 사용 설정

개요vue로 포트폴리오 프로젝트 진행 중 특정 클래스들을 추가하는 코드를 별도의 데이터 파일로 관리했더니 해당 클래스의 빌드가 정상적으로 이루어지지 않는 오류가 발생했다.해결방법// tailwind.config.jsmodule.exports = { ... safelist: [ 'text-gray-500', // 미리 빌드하고 싶은 클래스 { pattern: /bg-(red|blue|green)-(100|200|500)/, // 정규식을 사용하여 여러 클래스 포함 variants: ['hover', 'focus'], // 변형 클래스 포함 (예: hover:bg-red-500) }, ], ...}

설명하기에 앞서🎉 본 글에서 제공하는 모든 내용은 저작권법에 의하여 보호받는 저작물이지만 이에 대한 무단 복제 및 배포를 환영합니다. 🎉  Aleph Kim's Portfolio Website🖥️ 프로젝트 소개Aleph Kim의 포트폴리오 웹사이트는 개발자의 역량과 프로젝트를 효과적으로 소개하기 위해 제작된 개인 웹사이트입니다.이 프로젝트는 데이터와 UI를 철저히 분리하여 사용자에게 커스터마이징과 확장성을 극대화할 수 있도록 제작하였습니다.🚀 주요 강점: 데이터 분리 구조이 웹사이트는 데이터를 독립적으로 관리하는 구조를 채택하여 개발, 유지보수, 확장성에서 많은 이점을 제공합니다.🛠️ 사용 기술Frontend: Vue.js (컴포넌트 기반 설계)Styling: Tailwind CSS (유틸리티 ..

개요프로젝트 진행 중 스크롤 애니메이션을 추가해보려 관련 라이브러리를 찾아보았다.이 글은 vue.js 3버전에서 AOS라는 라이브러리를 사용법하는 방법에 대한 글이다.설치npm install aos@2.3.4 # 마지막 정식 배포 버전이 2.3.4버전이다main.js 수정import { createApp } from 'vue';import App from './App.vue';import AOS from 'aos';import 'aos/dist/aos.css';// Vue 앱 생성const app = createApp(App);// AOS 초기화app.mount('#app');AOS.init();사용 예시 나타날때 올라오는 요소참고aos 다양한 효과 demoaos 공식 github

개요처음으로 컴포넌트 라이브러리를 사용하지 않고 다크모드를 구현하려니 수많은 난관을 만나게 되었다. 다음에는 이번처럼 헤매지 않기 위해 기록해두려 한다.코드tailwind.config.jsclass="dark:text-white"와 같이 다크모드일 경우 스타일 요소를 지정하기 위한 설정module.exports = { purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'], theme: { extend: {}, }, variants: { extend: {}, }, plugins: [], darkMode: 'selector', // 3.4.1 버전 이후일 경우 darkMode: 'class'..

개요프로젝트 진행 중 다크모드 전환 간 tailwindcss로 transition 값을 설정한 요소의 transition이 매끄럽지 않음을 발견하게 되어 이를 해결할 방법을 찾아보았다.원인tailwindcss로 transition을 설정할때 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);라는 값이 포함되는데, 이로 인해 기본 css로 transtion을 설정했을 때와 차이가 발생함을 확인했다.해결 방법transition-timing-function 값을 기본값으로 설정해주면 된다.찾아보니 transition-timing-function의 기본값은 ease값이라고 한다. tailwindcss에서는 ease-[ease]이게무슨이상한코드야로 설정할 수 있..

코드 See the Pen Untitled by 김채민 (@aleph-kim) on CodePen.출처https://cloud-library.tistory.com/entry/CSS%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-%EA%B0%84%EB%8B%A8%ED%95%9C-%ED%83%80%EC%9D%B4%ED%95%91-%EC%95%A0%EB%8B%88%EB%A9%94%EC%9D%B4%EC%85%98

개요이전 시간에는 homebrew 패키지를 정리(하다가 기껏 정리 다 해놓고 마지막에 실수로 모든 패키지를 삭제해버림)해보았다.이번 시간에는 무분별하게 설치된 pip 패키지를 정리하려 한다.pip 패키지도 오늘 설치한 패키지만 삭제하려 했는데 생각해보니 homebrew와는 다르게 pip은 다양한 관리 도구가 있는데 내가 사용하지 않은 것이고, 다른 사람들은 다들 관리 도구를 사용할 것이기 때문에 굳이 오늘 설치한 pip 패키지 정렬 방법을 찾는다거나, 특정 기간에 설치된 pip 패키지 삭제 방법등은 필요하지 않을 것 같았다.그리하여 그냥 모든 pip 패키지를 깡그리 삭제하려고 한다ㅎㅎ삭제 명령어pip freeze | xargs pip uninstall -y설명pip freeze: 모든 패키지 목록 출력|..