본문 바로가기

Programing371

Glitch를 이용해서 json-server 생성하기 Glitch란?Glitch 소개글리치란 개발자들이 웹 앱을 쉽게 만들고 호스팅 할 수 있도록 도와주는 서비스이다. 특히 빠르게 프로토타입을 만들고 실험해볼 수 있는 환경을 제공해준다는 장점이 있다. 단순히 json 형식을 반환하는 데이터를 json-server로 가동 중이었다면 이것을 무료 요금제로도 서버를 대신 호스팅해준다. 작업 소요시간은 10분 내외로 간단하다. 이 방법에서는 깃허브 계정이 필요하다. Glitch 요금제무료 (스타터)프로젝트와 코드는 기본 제공5분 후 절전모드 전환되는 풀스택 앱 제공24시간 작동되는 무제한의 정적 사이트 제공GitHub import 및 export, Prettier 지원월 8달러 (프로) (연 결제 옵션 있음)비공개 프로젝트로 더 많은 제어 권한 부여더 빠른 부스트.. Programing/Server 2024. 6. 14.
Algorithm TimeAttack 문제// 1부터 6까지 숫자가 적힌 주사위가 세 개 있습니다.// 세 주사위를 굴렸을 때 나온 숫자를 각각 a, b, c라고 했을 때 얻는 점수는 다음과 같습니다.// 1) 세 숫자가 모두 다르다면 a + b + c 점을 얻습니다.// 2) 세 숫자 중 어느 두 숫자는 같고 나머지 다른 숫자는 다르다면 (a + b + c) × (a2 + b2 + c2 )점을 얻습니다.// 3) 세 숫자가 모두 같다면 (a + b + c) × (a2 + b2 + c2 ) × (a3 + b3 + c3 )점을 얻습니다.// 세 정수 a, b, c가 매개변수로 주어질 때, 얻는 점수를 return 하는 solution 함수를 작성해 주세요// ( 알파벳 뒤의 글자는 각각 2 : 제곱, 3 : 세제곱을 의미합니다.)// 입출력 .. Programing/CodeKata 2024. 6. 14.
로그인 하지 않은 상태에서는 헤더가 렌더링 되지 않게 조건부 렌더링 설정하기 헤더를 라우팅하는 컴포넌트에서 아래와 같이 설정해주면 된다.  useLocation 훅 import 하기import { useLocation } from "react-router-dom"; 로그인 되어 있지 않으면 로그인 페이지로 이동시키기const location = useLocation();const isLoginPage = location.pathname === "/login";...return ( {!isLoginPage && } ); Programing/React 2024. 6. 14.
마우스 호버 시 살짝 커지는 CSS /* 필요한 CSS를 작성하고 아래 속성을 이어 붙인다 */transition: transform 0.3s ease-in-out;&:hover { transform: scale(1.2);} Programing/CSS 2024. 6. 14.
2024-06-14 프로젝트 관리 중인 데이터를 json-server로 RESTful하게 리팩토링 하기 상황현재 본인의 프로젝트는 App 컴포넌트에서 expeness라는 상태를 만들고 여기에 json 형태의 데이터를 입력하여 이를 컴포넌트에 props를 내려 디테일 페이지에서 렌더링 하고 있다.function App() { const [expenses, setExpenses] = useState([ { id: "59454ecd-0f61-422a-89d9-3213915343f2", month: 1, date: "2024-01-05", item: "식비", amount: 100000, description: "세광양대창", }, { id: "4f60bace-03dc-458d-b0dc-d89ada034b29", month:.. Programing/TIL 2024. 6. 14.

티스토리툴바