# render

53개의 포스트
post-thumbnail

NextJS의 꽃 pre-render

아직도 NextJS 는 SSR로만 알고 있나요?

2023년 5월 23일
·
2개의 댓글
·
post-thumbnail

Django 배우기(4)

📎 생성기능 구현 👉 목표 이번에는 글을 작성하는 부분을 만들어본다. title을 작성하는 부분과 글의 body를 작정하고 제출 버튼을 누르면 topics에 추가가 된다. 그리고 새로 생성된 topic을 클릭하면 그 페이지의 상세보기 페이지로

2023년 5월 2일
·
0개의 댓글
·

Express.js(4.x API)의 res.redirect, res.render 그리고 보안

Express.js의 `res.render`는 서버에서 HTML 생성 및 전송에 사용되며, `res.redirect`는 클라이언트를 다른 URL로 리다이렉트합니다. 보안을 위해 사용자 입력 처리와 경로 보안에 주의해야 합니다.

2023년 4월 14일
·
0개의 댓글
·
post-thumbnail

리액트 렌더링 (trigger, render, commit)

Triggering a render (주문을 주방에 배달)Rendering the component (주방에서 주문대로 요리)Committing to the DOM (손님에게 서빙)render가 일어나는 두 가지 원인(trigger)1) initial render (컴

2023년 4월 10일
·
0개의 댓글
·
post-thumbnail

React가 VirtualDOM을 활용하는 방법

원티드 프리온보딩 프론트엔드 챌린지 4월 - 리액트 해부학VirtualDOM, Reconciliation, FibercreateRoot()과 render()의 역할React가 Reconciliation을 통해 화면을 그리는 방법Fiber Reconciler의 rende

2023년 4월 10일
·
0개의 댓글
·
post-thumbnail

Jest + Testing Labrary 기본 문법

CRA로 앱 설치했을 때 기본 제공되는 테스트 코드인자로 주어진 컴포넌트의 JSX에 대한 가상 DOM을 만든다.screen global을 통해서 가상 DOM에 접근한다. render 메서드와 screen global 객체 둘 다 RTL를 import해서 가져온다. (

2023년 3월 15일
·
0개의 댓글
·
post-thumbnail

230214 React x AJAX

리액트에서 JSP 파일을 읽는다. jsp의 경로는 빌드 후 배포한 react파일과 도메인이 같아야한다.

2023년 2월 14일
·
0개의 댓글
·
post-thumbnail

리랜더링시 애니메이션 재생

컴포넌트 최초 랜더링시에 애니메이션은 재생된다.하지만 리랜더링시에는 애니메이션이 다시 재생되지 않는 상황이 발생된다.문제상황라우터를 통해서 같은 포멧의 페이지 전환을 하려고 한다.같은 주소에서 params만 변경되면 주소만 바뀌로 리랜더링이 일어나지 않는다.때문에 us

2023년 2월 10일
·
0개의 댓글
·
post-thumbnail

Render와 State 좀 더 알아보기

리액트는 많은 기능 중 우리가 만든 컴포넌트를 화면에 렌더링 하는 역할도 맡고 있다. 리액트가 컴포넌트를 렌더링하는 이유는 크게 두가지로 나눌 수 있는데, 컴포넌트의 초기 렌더링과 컴포넌트의 state 변화이다. 아래에서 좀 더 자세히 알아보자. 당연히 맨처음 컴포넌트

2023년 2월 2일
·
0개의 댓글
·
post-thumbnail

[Front-end] 수업 #069일 1-5

React POFO 클론코딩 -> React로 옮겨보기 실습 >지난번 POFO 클론코딩 페이지를 HTML , CSS , JavaScript로 만들었고 그것을 토대로 React에 Component화 시켜서 옮기는지 간단하게 알아보는 시간이다. 의 구성 >에 기본적으로 가 들어가고 안에 Component를 생성하여 넣어준다. WrapComponent 최상위...

2023년 1월 31일
·
0개의 댓글
·
post-thumbnail

[알게된 것] Ref? 왜써야할까?

Ref를 사용해야 하는 이유는 크게 두 가지로 나뉜다.1\. DOM에 접근하여 HTML Element를 핸들링 해야하는 경우2\. 상태 변화를 갖는 변수가 필요하지만, 화면이 리렌더링 되는 것을 원치않는 경우위 이미지는 Virtual DOM을 정확하게 표현하는 자료라고

2023년 1월 26일
·
0개의 댓글
·
post-thumbnail

브라우저는 어떻게 렌더링 할까?

우리가 흔히 알고 있는 chrome, safari, opera 같은 브라우저는 어떻게 렌더링이 되는 걸까?\

2023년 1월 15일
·
0개의 댓글
·
post-thumbnail

[Front-End] Redux란?

What is Redux? 개발 공부를 하다보면 Redux에 대한 이야기는 자주 나온다. 이번에는 Redux가 정확히 무엇이며, 우리가 왜 이를 사용해야되는지 알아보려한다. 더 나아가 어떻게 이를 사용할 수 있을지 한번 알아보자.

2023년 1월 7일
·
0개의 댓글
·
post-thumbnail

[React] Life Cycle

앱 개발을 하면서 렌더링 되기 직전 이나 새로 변경된 후 특정 작업을 수행해야 한다면 life cycle 은 확실히 잡고 넘어가는 것이 좋을 것이다.React 의 component Life Cycle 은 크게 3단계로 분류가 가능하다.Mount → Update → un

2022년 12월 8일
·
0개의 댓글
·
post-thumbnail

mount VS render

마운트? 렌더링?

2022년 11월 11일
·
0개의 댓글
·
post-thumbnail

[리액트] 3. 컴포넌트 (1)

3. 컴포넌트 3-1. 컴포넌트 애플리케이션의 사용자 인터페이스를 설계를 할 때 사용자가 볼 수 있는 요소들은 여러 컴포넌트로 구성되어 있다. 컴포넌트는 단순한 템플릿 이상의 기능을 갖추고 있다. 데이터가 주어지면 UI를 구성 라이프사이클 API 이용 컴포넌트가 화면

2022년 10월 1일
·
0개의 댓글
·
post-thumbnail

[리액트] 1. 리액트 시작

1. 리액트 시작 1-1. 왜 리액트인가 한때 자바스크립트는 웹 브라우저에서 간단한 연산을 하거나 시각적인 효과를 주는 단순한 스크립트 언어에 불과했다. 하지만 현재는 웹 애플리케이션에서 가장 핵심적인 역할을 합니다. 더 나아가서 서버 사이드는 물론 모바일, 데스크톱

2022년 9월 29일
·
0개의 댓글
·
post-thumbnail

TIL#7

1) > 프로젝트 폴더의 urls.py에서 gallery/ url을 입력했을 경우 gallery 앱의 urls.py를 include 하도록 설정해줬다. >> gallery 다음 url이 int type으로 넘어올 경우 이를 pk란 이름으로 넘겨줄 것이고, views.py의 item_detail 함수-뷰(혹은 호출 가능한 객체)에서 이를 처리할 것이다. ...

2022년 8월 17일
·
0개의 댓글
·
post-thumbnail

TIL#4

1) > 어떤 페이지가 요청되면 django는 해당 요청의 metadata를 포함하는 httprequest를 생성하고 이를 적절한 view function에 첫번 째 인자로 넘겨준다. >> GET, POST,FILES 등의 함수는 django/http/request.py에서 확인할 수 있는 바, HttpRequest 클래스의 초기화 메소드 init 아래 정...

2022년 8월 10일
·
0개의 댓글
·