본문 바로가기

개발로 부자되기

(34)
react-table 너비 (width) 조정하기, 예제코드 import { useTable, useRowSelect, useSortBy, useGlobalFilter, usePagination, } from "react-table"; 예제 가져와서 구현해보고 있는데, 너비 조정할 필요가 있었다. 너비 조정하는 과정은 다음과 같은데, 1. 먼저 columns 배열에 minWidth정보를 채운다. 2. columns는 useTable에 사용된다. 3. 에서 각 column마다 설정된 minWidth정보가 사용된다. 각 순서에 대해 코드를 보면서 설명하면 컬럼 변수에 텍스트로 들어갈 부분, key값(accessor), minWidth를 넣어둔다. Cell을 보면 Cell엔 어떻게 표시될지가 표현된다. const COLUMNS = [ { Header: "customer..
해결법 Next.js error cannot find module 'next/headers' nextauth error가 발생할 수 있는데, 나 같은 경우엔 next.js version과 next-auth version이 안맞아서 난 에러였다. next version을 v12를 쓰고 있었는데 이 v12와 맞는 버젼에 next-auth를 써야 빌드된다. "next": "12.1.6", 아래 글처럼 "next-auth": "4.15.1" 로 고정한후 node_modules를 지우고 다시 빌드하니 문제없이 동작했다! https://stackoverflow.com/questions/74339649/next-js-error-cannot-find-module-next-headers Next.js error cannot find module 'next/headers' Faced this issue when ..
next.js에서 버튼 누를 시, url 이동하기 리디랙션(redirect) 리액트에서 버튼 누를시 다른페이지로 이동하는것을 보여주겠다. next/link 패키지를 사용하여 리디렉션 기능을 생성할 수 있습니다. 다음은 "/home"에서 "/p2p"로 리디렉션하는 예제 코드입니다: 이 예제에서는 Next.js에서 Link와 useRouter 컴포넌트를 가져옵니다. useRouter 훅을 사용하여 라우터 객체에 액세스하여 프로그래밍 방식으로 탐색할 수 있습니다. handleLinkToP2P 함수는 버튼 클릭시 호출되고, 이때 router를 통해 리디랙션을 할 수 있습니다. push로 하면 뒤로가기고 원래있던 home으로 올 수 있습니다. import React from "react"; import Link from "next/link"; import { useRouter } from..
카페 찾기에 대하여.. 나는 약간 카페를 작업실로 생각하며 간다. 집에서 책보고 개발하는것보다, 카페가서 하는걸 더 좋아한다. 또 여자친구를 만나도 데이트를 카페에서 많이 한다. 각자 개발하거나 같이 유튜브도 본다. 근데 카페가 워낙 많아서 선택하기가 어렵다. 선택지가 너무 많아 선택하기 어렵다. 개발자로써.. 아 카페 추천 사이트를 만들고 싶다. 라는 생각을 할 수 밖에 없다. 종종 여자친구는 이렇게 요청한다. 이 요구사항을 모두 충족하는 카페를 네이버에서 찾는건 넘나 어려운 일이다. 이런 수요가 많을까? 아무튼 필요한 기능으로는 내가 원하는 정보로 정렬할 필요가 있다. 요정도를 찾고 싶은건데, 네이버 지도에서 찾으려면 하나씩 눌러보면서 리뷰까지 보면서 찾고 있으니 너무 힘들다. 1. 주차는 되는지 2. 넓은 카페인지 3. ..
라이트닝 네트워크를 활용한 P2P 플랫폼 보호되어 있는 글입니다.
워드프레스 사이트 아이콘 (파비콘) 설정 워드프레스 홈페이지를 만들었다면, 아이콘을 변경하고 싶을꺼에요. 아래 이미지는 기본 파비콘인데, 이걸 원하는 이미지로 바꾸는 방법에 대해 적어봅니다. 쉽습니다. 자신의 워드프레스에 https://자기 워드프레스/wp-admin/customize.php로 들어가면 됩니다. https://blog.yanabu.com/wp-admin/customize.php 로그인 ‹ 야나부 워드프레스 — 워드프레스 blog.yanabu.com 사이트 아이덴티티를 누르고 사이트 아이콘 이미지 넣기를 하면 됩니다. 사이즈는 512x512 png로 넣으면 됩니다. 저는 450x450정도로 넣었는데 예쁘게 잘나옵니다.
5분만에 AWS LightSail 활용한 워드프레스 만들기 #2 고정IP 설정후 접속 안됨 해결 고정IP를 연결해두고, 도메인을 설정해보자. https://lightsail.aws.amazon.com/ls/webapp/ap-northeast-2/instances/ https://lightsail.aws.amazon.com/ls/webapp/ap-northeast-2/instances lightsail.aws.amazon.com 나 같은 경우엔 도메인은 cloudflare로 관리하기 때문에 약간 다를 수 있다. 고정IP생성후에 cloudflare에 추가하는것으로 DNS 설정을 끝냈다. 고정IP를 변경했더니 접속이 안됐다. 찾아보니 아래명령으로 ip변경을 할 수 있었다. sudo /opt/bitnami/configure_app_domain --domain https://lightsail.aws.amaz..
5분만에 AWS LightSail 활용한 워드프레스 만들기 #1 서버 만들기 워드프레스를 활용해서 자동 글 생성을 해보려고 한다. 워드프레스 셋팅하면서 글을 적어본다. https://lightsail.aws.amazon.com/ls/webapp/create/instance?region=ap-northeast-2 https://lightsail.aws.amazon.com/ls/webapp/create/instance?region=ap-northeast-2 lightsail.aws.amazon.com 요금제를 설정해야하는데 나는 한번 5달러로 설정해본다. 램은 1GB는 돼야하는거 아닌가 싶어서 말이다. 그 아래에 인스턴스 생성을 누른다. 이름은 마음대로 정해도된다. 태그는 따로 추가하지않아도 된다. 아래 이미지처럼 여기까지 만들었다면, 실행중이라고 뜨고 ip가 뜬다. 이 ip를 통해..