분류 전체보기 썸네일형 리스트형 Tailwind CSS vs SCSS (Sass) Tailwind CSSUtility-First Framework: Tailwind CSS는 utility-first CSS 프레임워크로, 클래스 이름이 특정 스타일을 의미한다. 예를 들어, bg-blue-500, text-center, p-4와 같은 클래스들이 있다.설정 및 커스터마이징: Tailwind는 설정 파일을 통해 쉽게 커스터마이징할 수 있다. 테마, 색상, 여백 등을 설정 파일에서 정의하여 재사용할 수 있다.재사용 가능한 클래스: 스타일을 클래스 단위로 재사용할 수 있어서, 동일한 스타일을 여러 요소에 적용할 때 편리하다.디자인 일관성: 디자인 시스템을 구현하기 쉽다. 미리 정의된 클래스들을 사용하여 일관된 디자인을 유지할 수 있다.JSX와의 호환성: React와 같은 프레임워크와 잘 통합되어.. JS / Truthy, Falsy 자바스크립트에서 falsy와 truthy 값은 다음과 같다.Falsy 값자바스크립트에서 falsy 값은 다음과 같은 6가지가 있다:false0 (숫자 0)-0 (음수 0)0n (BigInt의 0)"" (빈 문자열)nullundefinedNaN (Not-a-Number)이 값들은 조건문에서 false로 평가된다.Truthy 값Falsy 값에 해당하지 않는 모든 값은 truthy 값이다. 몇 가지 예시는 다음과 같다:true{} (빈 객체)[] (빈 배열)"hello" (빈 문자열이 아닌 문자열)42 (0이 아닌 숫자)-42 (음수이지만 0이 아닌 숫자)3.14 (부동 소수점 숫자)new Date() (Date 객체)Infinity (무한대)-Infinity (음의 무한대)이 값들은 조건문에서 true로 평.. Node.js) express로 간단한 CRUD 만들기 | 라우터, 컨트롤러(router, controller) controller 구현 먼저 간단하게 유저정보를 CRUD를 수행하는 콘트롤러를 구현한다. 데이터의 실질적인 CRUD 작업을 수행한다. controllers/user.js import { v4 as uuidv4 } from "uuid"; // 지금 단계에서는 데이터베이스와 연결은 안되어 있으므로 // 데이터를 조작할 변수를 선언해준다. let users = []; //모든 users 내용을 출력해주는 함수 //get all users export const getUsers = (req, res) => { console.log(`get request users`); res.send(users); } //특정 id값을 받아서 해당 유저의 내용만 출력하는 함수 //get a user export const g.. Node.js) express로 간단한 CRUD 만들기 | express 셋업 설치 npm init -y npm install express 사용한 패키지 bodyParser bodyParser, 미들웨어, 요청과 응답을 조작할 수 있게 해줌 request의 body를 원하는 형태로 파싱해줌 nodemon(dev로 설치 --save-dev) 소스 변경시 node 서버를 자동으로 재시작해주는 툴 uuid 네트워크 상에 고유성이 보장되는 id를 만들기 위한 표준 규약 UUID는 Universally Unique IDentifier의 약어이고 범용 고유 식별자라고 한다. UUID는 128비트의 숫자이며, 32자리의 16진수로 표현된다. 8자리-4자리-4자리-4자리-12자리 패턴으로 하이픈을 집어 넣어 5개의 그룹으로 구분한다. uuid 자세히.. UUID (Universally Uniq.. 22년 10월 개인작업계획서 node.js + express로 간단한 CRUD 구현하기 - 로컬에 express 셋업 및 설치(완) - 로컬에 마리아 DB설치(완) - express와 마리아DB연동 - crud를 위한 간단한 Vue.js 프론트엔드 작성 - REST.API로 CRUD하기 간단하게 플로우차트 그리기 (with diagrams.net) 간단한 플로차트 그리기 도구(diagram.net) 플로차트를 그릴때 주로 사용했던 도구는 PPT, Adobe illustrator, Adobe XD를 사용했었는데, 최근에 간단한 화면 플로를 그릴 일이 생겨서 XD로 진행하려다가 좀 더 그리기 쉽고 무료인 앱을 찾아보기로 했다. 일단 기존에 내가 쓰던 도구들은 다이어그램 그리기에 필요없는 기능들이 많고, 그래서 학습 난이도가 높다. 게다가 구독료도 무시할수 없는 수준. 플로차트만 그리면 되는데 저런 프로그램들의 일부 기능을 쓰기 위해서 라이선스를 굳이 구매해야 할 필요성도 못느끼고 무엇보다 저 소프트웨어들이 없는 환경에서 설치를 하는 시간과 PC의 리소스가 아깝다고 생각이 들었다. 그래서 구글링을 하다가 diagram.net이라는 툴을 발견. 정말 여러.. JS 자주쓰는 regex, function(replace) 2022.09.02 javascript regex, functions replace let str = date.replace("-", ""); //replace let str = date.replace(/-/gi, ""); //replace AllNumber regex regexNum = /[^0-9]/g;Email regex emailRegex = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,10}$/iTel regex telRegex : /^[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}/ 부트스트랩 Vue 사이드바 컴포넌트가 제대로 동작하지 않을때 (Bootstrap Vue Sidebar component not working properly) import 'bootstrap-vue/dist/bootstrap-vue.css 를 임포트 해줘야 한다. https://stackoverflow.com/questions/64213922/bootstrap-vue-sidebar-component-not-working-properly 이전 1 2 3 4 ··· 9 다음