키보드 깡패

목표업무 후에 Vite + React + FastAPI를 사용하면서 실질적으로 궁금한 것들을 테스트 해보는 용도로 환경을 만들어 두려한다. 기본 환경 설정frontend/ 폴더에 Vite 기반 React + TypeScript 템플릿 생성.아래 커맨드를 실행해준다.cd npm create vite@latest frontend -- --template react-tscd frontendnpm installnpm run dev 그럼 이렇게 기본 5173 포트로 React Template이 담긴 페이지가 뜬다. 프론트-백엔드 연동 환경설정frontend/ 폴더에 Vite 기반 React + TypeScript 템플릿이 있고, backend/ 폴더에 파이썬으로 된 기본적인 백엔드가 있으며, docker-co..

기본 설치할 것들 셋팅터미널에 npm install --global expo-cli터미널에서 brew install watchman아이폰 앱스토에서 Expo Go 설치계정 가입 & 로그인새 프로젝트 시작터미널에서 expo init Naa0Weatherblank 선택cd Naa0Weathercode .expo login터미널에서 expo login화면에 글자 띄워보기터미널에서 npm start폰에서 expo go 앱 열면 화면 뜸.위 같은 기본 텍스트가 App.js에 저장되어 있다.App.js에서 텍스트를 임의로 고쳐본다.고치면 이렇게 바로 화면에 실시간 변경된다.

figma 기초웹사이트, 모바일 앱, 데스크톱 애플리케이션 등의 사용자 인터페이스(UI) 및 사용자 경험(UX)을 디자인하는 데 주로 사용정적인 디자인을 인터랙티브한 프로토타입으로 변환할 수 있는 기능을 제공하기 때문에, 사용자가 실제 경험하게 될 흐름을 시뮬레이션 할 수 있음.왜 figma를 쓰면 좋을까?첫째, 사용하기 매우 직관적이며, 디자인 경험이 없더라도 쉽게 배울 수 있음.둘째, 실시간 협업이 가능함. 피드백도 남길 수 있음.셋째, 버전관리도 됨.넷째, 디자인에서 개발로의 전환을 쉽게 만들어 줌.개발자는 Figma 파일에서 필요한 코드를 바로 추출할 수 있으며, 이는 CSS(웹 애플리케이션의 UI), iOS, Android 등의 플랫폼별로 최적화된 코드로 제공되기 때문에, 개발자들은 디자인 요소..

오버로딩과 오버라이딩 차이오버로딩은 동일한 메서드의 이름으로 서로 다른 파라미터와 리턴 타입의 메서드를 여러 개 정의 (= 메서드 여러 개 싣기)하는 것을 의미하고, 오버라이딩은 부모 클래스에 정의된 메서드를 자식 클래스에서 새롭게 정의 (= 메서드 재정의)하는 것을 의미.오버로딩class OverloadingTest { public static void main(String[] args) { OverloadingMethods om = new OverloadingMethods(); om.print(); // 오버로딩1 System.out.println(om.print(3)); // 오버로딩2 찍히고 a.toString으로 3 찍히고 오버로딩3 ..

1. Java 소스 파일 만들기 (~.java)먼저, 우리가 코딩한 내용이 담긴 소스 코드 파일이 필요함. 이 파일의 확장자는 .java임. 여기에는 우리가 원하는 기능이나 동작이 코드로 적혀 있음.2. 컴파일하기 (by javac)이제 .java 파일을 컴파일해야 함.컴파일이란, 우리가 이해할 수 있는 코드를 기계가 이해할 수 있도록 변환하는 과정임.javac라는 컴파일러를 사용해서 이 작업을 함. 이렇게 하면 우리의 .java 파일이 기계가 알아들을 수 있는 바이트 코드로 바뀜.3. 바이트 코드 생성 (~.class)컴파일이 끝나면 .class 확장자를 가진 바이트 코드 파일이 만들어짐. 이 파일은 기계가 이해할 수 있는 코드로 변환된 상태임. 하지만 아직 이 파일만 가지고는 프로그램을 실행할 수 없..

접근 제한자 별 역할이나 관련 내용이 가물가물하여 한 번 통으로 정리할 겸 포스팅 한다.접근 제한자란?멤버들이 대외적으로 공개되는 것이 결코 좋은 것이 아니다. 객체가 가진 고유의 멤버 변수값들이 외부에서 잘못 변경되는 경우가 있는데, 사전에 멤버 변수와 함수들의 성격을 규정하고 차단함으로써 의도치 않은 실수를 줄이기 위한 의도가 깔려 있다.그런 이유로 프로그래머가 객체의 멤버들에게 접근 제한을 걸 수가 있는데 자바에서는 이를 접근 제한자라 한다. 제한자 종류public > protected > default > privatepublic : 모든 접근을 허용protected : 같은 패키지(폴더)에 있는 객체와 상속관계의 객체(파생클래스)들만 허용default : 아무런 접근 제한자를 명시하지 않으면 d..

문제 상황java 상속 시 하위 클래스 오버라이딩 메서드에서 must override or implement a supertype method 발생코드 조각class GameObject { protected void move(int dx, int dy) { } } class PacMan extends GameObject { @Override protected void move() { } }오류 메시지[{ "resource": "/Users/izero/Documents/GitHub/ne_231202_java/Challenge.java", "owner": "_generated_diagnostic_collection_name_#4", "code": "67109498", "severity": 8, "messag..

카카오톡 공유하기를 html + js로 뿌려주고 있는데 로컬에서는 file://파일명.html 이런 형식으로 html 파일로 앞단을 보고 있기 때문에, 사이트 도메인에서 직접 배포후에 볼수밖에 없었다. 외부 파일에서 모델이나 텍스쳐를 불러올 경우, 브라우저의' same origin policy 보안 제한때문에 파일 불러오기가 실패가 된다. 그냥 간단하게 8080 포트에서 html이 실행되게 하면 된다. http-server 설치 $ npm install http-server -g Html 파일을 Local Host에서 실행 - 터미널에서 cd 명령어를 사용하여 Html 파일이 있는 디렉토리로 이동 - 디렉토리에서 http-server를 입력하면, 파일 서버 처럼, 그 폴더의 모든 파일을 로컬 서버에서 열..

악덕? 기획자가 화면에 보이는 문구가 마음에 들지 않는다고, 상품명이라는 단어를 모두 상품이름으로 고쳐달라고 하면 어떻게 해야할까? 여러 화면에 보이는 상품명, 가격, 수량 등, label 에 있는 단어를 변경하려면 다음 화면들을 다 찾아가면서 모두 변경해야 한다. 화면 수가 적으면 문제가 되지 않지만 화면이 수십개 이상이라면 수십개의 파일을 모두 고쳐야 한다.왜냐하면 해당 HTML 파일에 메시지가 하드코딩 되어 있기 때문이다. 이런 다양한 메시지를 한 곳에서 관리하도록 하는 기능을 메시지 기능이라 한다.국제화메시지 파일( messages.properties )을 각 나라별로 별도로 관리하면 서비스를 국제화 할 수 있다.- messages_en.properties item=Item item.id=Item..

등록 기능 만들기 web > dto > PostsSaveRequestDto package com.izero.springboot.web.dto; import com.izero.springboot.domain.posts.Posts; import lombok.Getter; import lombok.NoArgsConstructor; @Getter @NoArgsConstructor public class PostsSaveRequestDto { private Long id; private String title; private String content; private String author; @Builder public PostsSaveRequestDto(String title, String content, S..