본문 바로가기

코딩 공부204

[React] React Context React Context 리액트 context는 앱에서 컴포넌트에게 props를 사용하지 않고 필요한 데이터를 넘겨주며 사용할 수 있게 해 줍니다. 다시 말해, 리액트 context는 컴포넌트들이 데이터(state)를 더 쉽게 공유할 수 있도록 해줍니다. 🏷️ 사용해야 할 때 리액트 context는 앱의 모든 컴포넌트에서 사용할 수 있는 데이터를 전달할 때 유용합니다. ✅ 데이터 종류 ▪️ 테마 데이터 (다크 모드 혹은 라이트 모드) ▪️ 사용자 데이터 (현재 인증된 사용자) ▪️ 로케일 데이터 (언어 혹은 지역) 데이터는 자주 업데이트할 필요가 없는 리액트 context에 위치해야 합니다. 왜냐하면 context는 전체적인 상태 관리를 위해 만들어진 시스템이 아니기 때문입니다. context는 데이터를.. 2023. 11. 29.
[React] Default Export와 Named Export 🏷️ Default Export Default로 선언된 모듈은 하나의 파일에서 단 하나의 변수 또는 클래스 등만 export 할 수 있습니다. // import import LoginComponent from './LoginComponent'; // export function LoginComponent() { // 생략 } export default LoginComponent; 모듈의 이름이 무엇이든 간에 default로 내보낸 모듈은 어떤 이름으로든지 import할 수 있습니다. import LoginComponent from './LoginComponent'; import LogoutComponent from './LogoutComponent'; import FooterComponent from '.. 2023. 11. 26.
[WEB] MPA와 SPA 🏷️ 웹의 역사 일반적으로 웹 애플리케이션은 MPA 방식으로 사용자가 한 페이지에서 다른 페이지로 이동하면 전체 콘텐츠를 로드하는 많은 정적 페이지를 연결하였으나 나중에는 많은 페이지가 연결된 웹 응용 프로그램이 속도가 느려지는 이슈가 있었습니다. 이 문제를 해결하기 위해 개발자는 2000년대 초반에 AJAX를 사용하여 MPA를 개선했습니다. 이 기술은 MPA 웹 앱의 성능을 향상시킬 수 있었으나 이것 역시 온라인 페이지의 복잡성 증가와 같은 몇 가지 역효과를 가져오게 되었습니다. 거의 10년 후, SPA 모델이 출시되었고 이것은 MPA + AJAX의 업그레이드 버전으로 SPA는 페이지 데이터와 레이아웃을 별도로 요청하고 결과를 브라우저에 직접 렌더링할 수 있습니다. 예를 들어서 유저가 온라인 쇼핑 중에.. 2023. 11. 25.
[React] React.js React 리액트(React)는 Facebook(현 Meta)에서 만든 Javascript 사용자인터페이스(UI) 라이브러리입니다. Facebook은 매우 복잡한 사용자 인터페이스를 가지고 있으며, 수많은 컴포넌트로 구성되어 있습니다. 기존의 방식보다 빠른 UI 렌더링과 반응성 등 페이스북의 성능 요구사항을 충족시키기 위해 2011년 Facebook의 소프트웨어 엔지니어 Jordan Walke는 React를 만들었습니다. 🏷️ 만들어진 이유 웹 개발이 복잡해짐에 따라 html, css, js만으로는 한계가 생겼으며, 초기에는 Web 개발을 위한 프론트엔드 라이브러리로 DOM조작을 쉽게해주는 jQuery 라이브러리가 주로 사용되었습니다. 그러나, 이후 DOM을 직접 조작하는 방식에 한계를 느껴 대규모 프로.. 2023. 11. 24.
[JPA] @Entity는 기본 생성자를 왜 가져야 하는가? @Entity는 기본 생성자를 왜 가져야 하는가? @Entity(name = "user_datails") public class User { @Id @GeneratedValue private Integer id; private String name; private LocalDate birthDate; @OneToMany(mappedBy = "user") private List posts; public User(Integer id, String name, LocalDate birthDate) { this.id = id; this.name = name; this.birthDate = birthDate; } public User() { } // getter, setter, toString 생략 } 위와 같이 .. 2023. 11. 22.
[Spring] Response Customizing Response Customizing RestAPI에서 Response로 Bean을 반환 할때, 구조는 Bean의 모든 변수를 반환하게 됩니다. 하지만 특정 상황에서 이와 같이 정확하게 모든 Bean의 모든 값을 반환하고 싶지 않은 경우 커스터마이징을 사용합니다. 🏷️ 정적 필터링 정적 필터링은 필터를 적용하면 해당 Bean에 대한 모든 응답에 동일하게 필터링이 됩니다. @JsonIgnoreProperties("field1") // 정적 필터링 방법2 -> 여러게 필터링시 {v1, v2} 형식 public class SomeBean { private String field1; @JsonIgnore // 정적 필터링 방법 1 -> 필드 이름 변경시 따로 변경하지 않아도됨 private String fiel.. 2023. 11. 20.