8. 스박사님을 아세욧?

스박사님은 스타일드컴포넌트를 말합니다~ 왜 박사냐고요? 그냥요~~ 스타일드 컴포넌트가 뭐냐? CSS를 React에 그대로 적용하는게 살짝 불편합니다. 이 불편함을 해결하기 위해 새로운 기술들이 등장 했는데, 그중에서도 가장 인기 있는 기술이 바로 스 타 일 드 컴 포 넌 트 다 이말이야! 그럼 어떻게 쓰느냐? import styled from 'styled-components'; const Button = styled.button` background-color: #ededed; border: none; border-radius: 8px; `; function App() { return ( Styled Components! 확인 ); } export default App; //출처 코드잇 강의 이렇게 J..

• format_list_bulleted Upscaling
• · 2024. 3. 10.
• textsms

6. append와 extend

파이썬에서 리스트에서 무언가를 더할 때 그냥 +로 더할 수 있다. 그러나 그렇게되면, 새로운 리스트를 반환하게 된다. 이때, 유사한 기능을 하는 extend나 append는 새로운 리스트를 추가하는 게 아니라, 기존의 리스트에 값을 추가하게 된다. 다만 이 둘도 동작상의 차이는 있다. append는 매개변수 그 자체를 추가하게 된다. extend는 삽입되는 리스트를 풀어서 각각의 엘리먼트로 추가된다. 내 코드는 아래와 같다. def merge(list1, list2): # 여기에 코드를 작성하세요 mer_list = [] i=0 j=0 while ((i list2[j]): mer_list.append(list2[j..

• format_list_bulleted Upscaling
• · 2024. 3. 6.
• textsms

5. min max 트렌드를 따라가지 못하는 늙은 코딩

함수 trapping_rain은 건물 높이 정보를 보관하는 리스트 buildings를 파라미터로 받고, 담기는 빗물의 총량을 리턴해 줍니다. 예를 들어서 파라미터 buildings로 [3, 0, 0, 2, 0, 4]가 들어왔다고 합시다. 그러면 0번 인덱스에 높이 33의 건물이, 3번 인덱스에 높이 22의 건물이, 5번 인덱스에 높이 44의 건물이 있다는 뜻입니다. 1번, 2번, 4번 인덱스에는 건물이 없습니다. 그러면 아래의 사진에 따라 총 1010 만큼의 빗물이 담길 수 있습니다. 따라서 trapping_rain 함수는 10을 리턴하는 거죠. 해설 현재 인덱스의 왼쪽에서 가장 높은 건물의 높이를 구한다 현재 인덱스의 오른쪽에서 가장 높은 건물의 높이를 구한다 그 중 더 낮은 건물의 높이를 구한다 그 ..

• format_list_bulleted Upscaling
• · 2024. 3. 4.
• textsms

3. 아주 짤막한 React의 탄생 및 핵심 개념

많은 사람들이 프론트엔드 개발 분야를 리액트 전과 후로 나누기도 하고, 혹자는 리액트가 실질적으로 프론트엔드 분야를 만들었다고 이야기 한다. 역사 웹 앱의 규모가 커지면서 파일들의 관리가 어려워졌고, JS의 중요성이 점점 커지게 되었다. 전통적인 웹은 페이지마다 각각 HTML,CSS,JS 파일을 가지고 있어야 했고, 페이지를 이동할 때 마다 이를 주고받아 로딩 속도가 느렸다. SPA(Single Page Application)가 등장하면서 위 파일들을 1회만 로드하고, JS를 통해 DOM을 조작하게 되었다. 내가 미취학 아동이었던 시절, 2006년에 Jquery가 발표되면서 세상의 표준으로 자리잡았고, 이후엔 구글의 Angular가 이를 활용하여 꽉 잡고 있었다고 한다. 교내 기숙사에서 시작된 페이스북은..

• format_list_bulleted Upscaling
• · 2024. 2. 5.
• textsms

2. 파이썬의 산술 연산자에 의한 귀여운 뇌절

간만에 멘탈 케어를 위해, 가볍게 재귀 문제를 풀어보고 있다. 파이썬이라는 언어가 생소하여 굉장히 상스러운 문제를 겪었다. 각 자릿수의 합을 리턴하는 기초적인 문제였고, 아래와 같이 풀어냈다. 그러나 출력 결과가 몹시 이상한 것이다. 알고보니, 파이썬은 데이터에 따라 자료형을 자동으로 변환해준다고 한다. 그래서, 처음엔 정수였지만 나누기 연산에 의해 소수가 된 것이었다. 눈치껏 이를 파악해 아래와 같이 무식하게 형변환을 통해 문제를 해결했다. 그러나 파이썬에는 내가 알던 타 언어와 다르게 '//' 라는 '버림 나눗셈' 연산자가 있었다. 나눈 후 몫이 소수점이면 내림을 하는 연산자인데, 대충 다른 언어에서의 나눗셈 산술연산과 같은 것이다. 저 연산자를 알았다면 모범 답안처럼 풀었을텐데. 새로운 언어를 다루..

• format_list_bulleted Upscaling
• · 2024. 1. 25.
• textsms

1. React 상태 관리의 흐름

- 복잡한 데이터를 어떻게 효율적으로 관리할까? -> 상태 관리 : 화면에서 사용하는 데이터를 관리하는 것 - 문제 : Prop Drilling(하위 컴포넌트로 반복해서 Prop을 내려주는 것) - 해결 : Context(여러 컴포넌트, 후손과 조상 간 데이터를 공유) - 참고 : https://ko.legacy.reactjs.org/docs/context.html - 문제 : 여기저기서 데이터를 손대면서 추적 및 문제 해결이 어려워짐 - 해결 : Flux(데이터의 변경을 한 곳에서 하면서 흐름을 정리) -> 데이터를 변경하고 싶으면 액션을 만들어 Dispatcher에 전달 -> Store에 전달 -> 변경 후 렌더링 - 참고 : https://www.freecodecamp.org/news/how-to-..

• format_list_bulleted Upscaling
• · 2024. 1. 20.
• textsms

트랜잭션

- 트랜잭션 : 하나의 단위로 취급하는 SQL 문장들의 모임. -> 많은 사람들이 동시에 DB에 접근해서 사용하는데 번호표를 다 지정해줘. -한 번에 하나씩 하면 ㅈㄴ오래걸리겠지. 동시에 트랜잭션을 허용해야함. - DB를 쓰는 도중에 죽었따 살아났따 어떡할거냐! 절대로 데이터베이스에 뭔가가 깨지는걸 냅둬서는 안된다. - 500명이 재직. 급여협상. - 500명의 레코드가 한 블록에 다 들어가느냐? 4,8kb잡아도 500명분이 다 들어갈 순 없겠지. - 한 블록에 20개, 25개의 블록을 디스크에서 주기억장치 버퍼로 가져와서 모두 버퍼에 읽어서 급여를 6% 올려서 하다가, 25개를 다 버퍼에 올릴 수 있으면 다 올리면 되지. - 뭐 그랬다 치더라도 이걸 디스크에 동시에 기록하는건 불가능하지. 16번째 블록..

• format_list_bulleted UOS/UOS@DB
• · 2023. 12. 19.
• textsms