전체 글 204

[React] JSX 안에서 중첩 삼 항 연산자 사용하기

리액트의 return문에서 조건문을 사용하려면 JSX 문법을 사용해야 한다. 이때 삼 항 연산자를 많이 사용하는데, 중첩으로 사용할 때 헷갈려서 기록을 남긴다. 사용자 로그인 여부에 따라 보여주는 내용이 다르고, 로그인 한 사용자도 레벨에 따라 다른 내용을 보여주는 기능을 구현하기 위해 삼 항 연산자를 중첩해서 사용했다. import React, { useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; import styled from 'styled-components'; import { LoginState } from '../../states/LoginS..

Web/React 2022.11.17

[React] Nested Routes

중첩 라우팅(nested routing)이란 여러 유사한 페이지를 필요로 할 때 사용된다. 예를 들어, 회사 정보를 보여주는 /about 페이지가 있는데 멤버 정보를 보여주는 /about/member 페이지와 회사 위치 정보를 보여주는 /about/location 페이지도 만든다고 하면 import React from "react"; import { Route, Routes, BrowserRouter } from 'react-router-dom'; function App() { return ( ); } export default App; 이런 식으로 코드를 작성할 수 있다. 하지만 위 방법이 아닌 중첩 라우팅을 사용하면 라우트 작성이 더 간단해지고, 중첩된 element들을 동시에 보여준다는 장점이 있다..

Web/React 2022.10.13

[Python] list 랜덤 추출

random 라이브러리의 모듈 함수 choice, choices, sample을 사용하면 list 요소를 랜덤으로 추출할 수 있다. 1) random.choice 요소를 랜덤으로 하나 추출해주는 함수이다. list 형태로 반환하는 것이 아닌 요소 자체가 하나 반환된다. ex) '사과' (str 형태) import random list = ['사과', '바나나', '오렌지', '레몬', '블루베리'] result = random.choice(list) # print(result) -> 랜덤으로 요소 하나 추출 2) random.choices 요소를 랜덤으로 여러 개 추출해주는 함수이다. 요소 값이 중복 가능하다는 특징이 있다. 여러 개를 뽑기 때문에 list 형태로 반환된다. import random li..

파이썬 2022.10.10

[Python] 중첩 list 평탄화

1) extend 사용 def flatten(arg): ret = [] for i in arg: ret.extend(i) if isinstance(i, list) else ret.append(i) return ret 2) itertools 라이브러리 사용 import itertools origin = [['복숭아', '수박'], ['토마토', '자두'], ['블루베리','레몬']] flatten = list(itertools.chain.from_iterable(origin)) # print(flatten) -> ['복숭아', '수박', '토마토', '자두', '블루베리', '레몬'] itertools.chain.from_iterable()을 사용해 중첩 리스트를 풀면 itertools.chain type..

파이썬 2022.10.10

[Python] list 형태의 문자열 list로 변환

list 형태의 문자열을 list로 변환하고 싶을 때는 eval 함수를 사용하면 된다. str = "['수박', '복숭아', '토마토']" arr = eval(str) # print(str, type(str)) -> ['수박', '복숭아', '토마토'] # print(arr, type(arr)) -> ['수박', '복숭아', '토마토'] 처음엔 replace를 사용해서 괄호를 제거하는 방식으로 시도했는데, eval 함수를 사용하니 편리하게 변환할 수 있어서 좋은 것 같다.

파이썬 2022.10.09

이진 변환 반복하기 (JS)

https://school.programmers.co.kr/learn/courses/30/lessons/70129 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr function solution(s) { let cnt = 0; // 이진 변환 횟수 let zeroCnt = 0; // 제거된 0의 개수 while (s.length !== 1) { let beforeX = s.length; s = s.replace(/0/g, ""); let afterX = s.length; zeroCnt += (beforeX - afterX) s = afterX.toStrin..

올바른 괄호 (JS)

https://school.programmers.co.kr/learn/courses/30/lessons/12909 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr function solution(s){ const arr = s.split(''); let tmp = []; let answer = true; arr.map(char => { if (char === ')') { if (tmp.length === 0) { answer = false; } tmp.pop(); } else { tmp.push(char); } }) if (tmp.length > 0) an..