Potato

리액트에선 컴포넌트 선언 방식은 크게 두 가지로 나뉜다.

첫 번째는 클래스형 컴포넌트

두 번째는 함수형 컴포넌트이다.

현재는 대부분 함수형 컴포넌트로 개발을 진행하지만 과거 프로젝트를 마이그레이션 하거나 유지보수를 하기위해 클래스형 컴포넌트에 대한 개념을 알고 있으면 도움이 된다.

 

특징

클래스형 컴포넌트

1. class 키워드로 시작

2. Component로 상속 받음

3. render() 함수를 사용해서 JSX를 반환

4. props를 조회할 때 this 키워드 사용

 

함수형 컴포넌트

1. JSX를 return문을 사용해서 반환

2. state를 사용할 수 없다

3. 생명주기 함수를 작성할 수 없다.

 

 

마지막으로 두가지의 컴포넌트 선언 방식은 생명주기를 다룰때도 차이가 나는데

클래스형 컴포넌트는 this를 통해 생명주기를 다루며

함수형 컴포넌트는 useState와 useEffect를 이용하여 생명주기를 다루게된다

'WEB > React' 카테고리의 다른 글

[React] state는 왜 setState를 이용하여 변경해야될까  (1) 2023.10.16
[React] Hook이란?  (0) 2023.10.14
[React] Redux 설치 방법 및 세팅  (0) 2023.01.09
[React] Axios 설치 방법 및 사용법  (0) 2023.01.08
[React] useEffect  (0) 2023.01.08

 

  • 유클리드 호제법을 이용하여 구했다
num1, num2 = map(int, input().split())

# 유클리드 호제법을 사용하여 최대공약수를 구함
def gcd(a, b):    
    remainder = a % b
    while remainder > 0:
        # a와 b의 값을 갱신
        a = b
        b = remainder
        remainder = a % b
    return b

print('1' * gcd(num1, num2))

'Python > 백준' 카테고리의 다른 글

[백준/Python] 1339. 단어 수학  (0) 2023.10.12
[백준/Python] 4179. 불!  (0) 2023.08.04
[백준/Python] 13241.최소공배수  (0) 2023.04.12
[백준/Python] 12761.돌다리  (0) 2023.03.03
[백준/Python] 13565. 침투  (0) 2023.03.02

HTML이란? 

HTML 은 Hyper Text Markup Language 약어로 HyperText(웹 페이지에서 다른 페이지로 이동할 수 있도록 하는 것) 기능을 가진 문서를 만드는 언어

 

시멘틱 태그란?

시맨틱(semantic)이라는 '의미의', '의미론적인'라는 뜻을 가진 형용사입니다. 즉 시맨틱 태그는 의미를 부여한 태그

 

시멘틱 태그 종류

<header> 사이트의 머리부분에 사용
<main> 메인 콘텐츠를 나타내는데 사용
<section> 제목별로 나눌 수 있는 문서의 콘텐츠 영역을 구성하는 요소
<article> 개별 콘텐츠를 나타내는 요소
<aside> 좌우측의 사이드 영역
<footer> 사이트의 바닥부분, 주로 연락처나 제작자 정보등을 기술하는 부분
<hgroup> 제목과 부제목을 묶어서 나타내는 요소
<nav> 웹 페이지 메뉴를 만들 때 사용

 

참고링크

https://webclub.tistory.com/608

 

#1 HTML 이란 무엇인가?

HTML 이란 무엇인가? HTML 은 Hyper Text Markup Language 약어로 HyperText(웹 페이지에서 다른 페이지로 이동할 수 있도록 하는 것) 기능을 가진 문서를 만드는 언어입니다. 다시 말해, 구조를 설계할 때 사

webclub.tistory.com

https://coding-factory.tistory.com/883

state란 무엇인가?

간단하게 말해서 state는 변수이다.

state는 일반변수와 다르게 값이 변하면 렌더링이 일어나는 객체임

 

setState를 사용하는 이유

state는 immutble(불변성)을 유지해야 하기 때문이다.
state는 컴포넌트 렌더링에 영향을 주는 데이터를 갖고 있는 객체인데, 이것을 업데이트 하기 위해서는 setState,useState가 필요하다. 직접 state를 수정하면 리액트는 render 함수를 호출하지 않아서 렌더링이 일어나지 않고 setState를 호출하여 state를 변경하면 리액트 엔진이 render 함수를 이용해서 렌더링을 실행하기 때문

 

 

참고링크

https://velog.io/@codns1223/React-state-변경시-setState로-변경해야-하는-이유

'WEB > React' 카테고리의 다른 글

[React] 클래스형 컴포넌트 vs 함수형 컴포넌트  (0) 2024.01.03
[React] Hook이란?  (0) 2023.10.14
[React] Redux 설치 방법 및 세팅  (0) 2023.01.09
[React] Axios 설치 방법 및 사용법  (0) 2023.01.08
[React] useEffect  (0) 2023.01.08

Hook이란

Hook은 함수형 컴포넌트가 클래스형 컴포넌트의 기능을 사용할 수 있도록 해주는 기능

 

Hook이 필요한 이유

클래스형 컴포넌트에서만 가능하던 상태관리를 더 손쉽게 할 수 있기 때문

 

주의사항

 

Hook은 브라우저의 메모리 자원을 사용하기에 함부로 남발하면 오히려 성능저하를 일으킴

 

주요 Hooks

  1. useState (동적 상태 관리)
  2. useEffect (side effect 수행 -mount/unmount/update)
  3. useContext (컴포넌트를 중첩하지 않고도 전역 값 쉽게 관리)

그외 Hooks

  1. useReducer (복잡한 컴포넌트들의 state를 관리 -분리)
  2. useCallback (특정 함수 재사용)
  3. useMemo (연산한 값 재사용)
  4. useRef (DOM선택, 컴포넌트 안에서 조회/수정할 수 있는 변수 관리)
  5. useImperativeHandle
  6. useLayoutEffect
  7. useDebugValue

 

참고링크

https://velog.io/@goyou123/React-Hooks-총정리

 

- 딕셔너리를 이용하여 풀었다

 

import sys

n = int(sys.stdin.readline())

alphabet_dict = {}
answer = 0
pocket = []

for _ in range(n):
    alphabet = input()
    pocket.append(alphabet)

for alphabet in pocket:
    for i, char in enumerate(alphabet):
        num = 10 ** (len(alphabet) - i - 1)
        if char not in alphabet_dict:
            alphabet_dict[char] = 0
        alphabet_dict[char] += num

alphabet_list = [value for value in alphabet_dict.values() if value > 0]
sorted_list = sorted(alphabet_list, reverse=True)

for i, value in enumerate(sorted_list):
    answer += value * (9 - i)

print(answer)

 

 

 

'Python > 백준' 카테고리의 다른 글

[백준/Python] 1850. 최대공약수  (0) 2023.11.04
[백준/Python] 4179. 불!  (0) 2023.08.04
[백준/Python] 13241.최소공배수  (0) 2023.04.12
[백준/Python] 12761.돌다리  (0) 2023.03.03
[백준/Python] 13565. 침투  (0) 2023.03.02

호이스팅이란 ?

 

변수나 함수 선언문이 해당 스코프의 맨 위로 옮겨지는것을 뜻한다.

 

호이스팅의 문제점

 

1. 호이스팅이 발생하게되면 개발자가 코드를 작성한 순서와 다르게 동작할 수 있으므로 주의가 필요

2. 변수 선언은 호이스팅되지만, 할당된 값은 그 자리에 남아있지 않고 undefined로 초기화되기 때문에 변수를 사용하기 전에 해당 값을 할당하지 않으면 예상치 못한 결과가 발생할 수 있음

 

호이스팅 방지

 

1. 변수나 함수를 사용하기전 반드시 초기화하는것을 권장

2. var, let대신 const 키워드를 사용하여 블록 스코프 지키기

- bfs를 이용하여 풀었다.

from collections import deque
import sys
input = sys.stdin.readline # 인풋 입력시간 줄이기

N,M = map(int,input().split())
arr = [list(input().rstrip()) for _ in range(N)]
q = deque([])
result = []

for j in range(N): # 지훈이부터 움직여야되니까 지훈이 위치부터 찾기
    for i in range(M):
        if arr[j][i] == 'J':
            arr[j][i] = 1 # 지훈이는 턴수로 초기화
            q.append([j,i])

for j in range(N):
    for i in range(M):
        if arr[j][i] == 'F':
            q.append([j,i])

def bfs():
    global result, flag

    directy = [-1,1,0,0]
    directx = [0,0,-1,1]

    while q:
        if result != []: # 지훈이가 탈출했다면 bfs 탈출
            break
        y,x = q.popleft()

        for k in range(4):
            dy = directy[k] + y
            dx = directx[k] + x

            if (dy < 0 or dy >= N or dx < 0 or dx >= M) and arr[y][x] != 'F': # 턴이 시작하기전 불이 아닌것이(지훈이) 밖으로 나간다면 result에 값을 넣어줌으로써 탈출여부 확인
                result.append(arr[y][x])
                break # 턴 시작전 탈출이 가능하다면 턴을 진행하지 않음

            if dy < 0 or dy >= N or dx < 0 or dx >= M or arr[dy][dx] == '#': # 배열 밖으로 벗어나거나 벽에 가로막히면 가지 않음
                continue

            if arr[dy][dx] == '.' and arr[y][x] != 'F': # 지나갈수 있는 공간이면서 현재 위치가 불이 아니라면(지훈이) 도착위치에 턴 초기화
                arr[dy][dx] = arr[y][x] + 1
                q.append([dy,dx])

            elif arr[dy][dx] == 'F' or arr[y][x] != 'F': # 현재 위치가 불이 아니면(지훈이) 갈 곳이 없으므로 패스하고, 가야할 위치가 지점이 불이라면 탐색하지않음(중복탐색방지)
                continue

            else: # 걸러지고 남은것들은 전부 불이 이동할 수 있는 위치뿐
                arr[dy][dx] = 'F'
                q.append([dy,dx])
                
bfs()

if result != []:
    print(min(result)) # 탈출이 여러번 된 경우에 가장 빨리 탈출했던것을 출력
else:
    print('IMPOSSIBLE')

 

 


놓쳤던 부분

 

- 불과 지훈이가 움직이는 턴을 하나로 봤어야했는데 같은턴에 가장자리에서 지훈이와 불이 만나게되더라도 지훈이가 먼저 움직여서 탈출로 출력했었다.

- 지훈이가 여러가지 방법으로 탈출이 가능하다는 것을 놓쳤다.

 

'Python > 백준' 카테고리의 다른 글

[백준/Python] 1850. 최대공약수  (0) 2023.11.04
[백준/Python] 1339. 단어 수학  (0) 2023.10.12
[백준/Python] 13241.최소공배수  (0) 2023.04.12
[백준/Python] 12761.돌다리  (0) 2023.03.03
[백준/Python] 13565. 침투  (0) 2023.03.02

키워드기반 일기메이트 추천 서비스

1. 기획배경

안녕하세요! 저희 팀은 취향, 키워드 기반 일기메이트 추천 서비스 버디어리를 소개해드리겠습니다.

많은 사람들이 일기를 쓰는것도 시간이고 굳이 필요성을 못느끼는 사람이 많다고 생각합니다
하지만 개발자들이 TIL을 통해 성장하듯이, 일기를 통해 오늘 있었던일을 정리하고 자기성찰을 통한 내적 성장을 할 수 있습니다.

 

 

 
박보영씨가 일기를 열심히 쓰는거로 굉장히 유명하다고 합니다.
다음은 실제로 박보영씨가 작성한 일기인데요.
"이런 상황에서 못하는것은 부끄러운 일이라고 생각했는데 그 일을 내가 저지르고 말았다.."
연기를 하다가 본인에게 굉장히 실망했었던 일이 있었는데 박보영씨는 이 일을 일기에 적음으로써 스트레스가 많이 풀렸다고 합니다

여러분 예전에 교환일기 다들 써보셨나요?
앞선 사례처럼 혼자서 일기를 쓰는것만으로도 스트레스가 풀릴 수도 있지만, 누군가 내 얘기를 들어주는 것만으로도 큰 힘이 나는 경우도 있고, 혹은 좋은일이 있었는데 자신과 성향이 비슷한 누군가와 공유하고 싶은 순간이 있습니다.

그런 분들을 위해 기획한게 저희 버디어리 입니다 !






2. 서비스 소개

완전 반응형

기본적으로 저희 버디어리는 완전 반응형으로 구현되어 있습니다
PC,패드,모바일 언제 어디에서나 저희 버디어리를 사용하실 수 있도록 어떠한 환경에서도 일관적인 디자인을 제공해드립니다

 





OAuth 로그인

저희는 그룹일기의 접근성을 위해 OAuth를 통한 카카오톡 회원가입과 로그인을 구현하였습니다
단순 OAuth가 아닌 시큐리티와 결합하여 표준화된 OAuth를 구현했습니다.
저희 서비스에 로그인하시게 되면 jwt 인증 필터를 통해 1차적으로 요청이 중간이 변조, 탈취되었는지 확인할 수 있습니다.
덕분에 안전하게 서비스 제공을 할 수 있으며 카카오톡 알람을 통한 그룹일기 초대 메세지를 보낼 수 있습니다.

 

 





메인 페이지

메인 페이지는 풀페이지로 섹션별로 구성되어있으며
여러 애니메이션을 통해 버디어리를 소개해드리고 있습니다.

 

 

 





실시간 알람

저희는 SSE를 통한 실시간 알람을 전송해드립니다.
1:1 채팅 요청을 받을 때, 본인이 속한 그룹에 새 글이 올라왔을 때 메세지가 전송됩니다
Web Socket은 양방향으로 데이터를 주고받을 수 있지만 SSE를 사용하게 되면 클라이언트는 데이터를 받기만 합니다.
SSE는 별도의 프로토콜을 사용하지 않고 HTTP 프로토콜만으로 사용할 수 있기 때문에 Web Socket 에 비해 훨씬 가볍기도 하고 저희 프로젝트 특성상 웹소켓보다 SSE를 사용하는게 더 적합하다고 판단해 SSE를 사용하게 되었습니다.

 

 





취향 기반 유저 추천

최초 회원가입시 진행했던 설문조사를 토대로 랜덤의 익명 유저와 자신과의 유사도를 비교하여 확인하실 수 있습니다
저희는 spring 서버와 fast api서버가 분리 되있는데 fastapi서버에선 최초 회원가입시 진행하는 설문조사의 답변을 기반으로 tf-idf 및 코사인 유사도 계산 과정을 거쳐 다른 유저와의 유사도를 보여줍니다.





키워드 기반 유저 추천

취향 기반 추천은 랜덤의 유저라면, 키워드 기반 유저 추천은 본인이 작성했던 일기를 기반으로 자신과 비슷한 키워드를 주제로 일기를 작성한 유저들을 추천하는 방식입니다.
일기 작성 시 soynlp를 활용해 키워드를 추출 후 단어의 빈도수와 비례한 키워드 점수 형태로 저장하여 마찬가지로 tf-idf 및 코사인 유사도 계산 과정을 거쳐 키워드가 비슷한 유저를 추천하게됩니다.





감정 분석

저희는 유저가 사용했던 일기의 감정분석을 제공해드리고 있습니다.
유저가 일기를 쓰게 되면 AI를 통해 감정을 분석해서 그 결과를 다이어리의 해당 날짜에 이모티콘 형태로 보여주게됩니다.





스티커

유저가 방을 만들거나 일기를 작성하게되면 포인트를 얻게 되는데 해당 포인트로 저희가 직접 제작한 스티커를 상점을 통해 구매하여 이용하실 수 있습니다.





그룹일기

카카오톡 초대를 통해 원하는 사람과 그룹일기를 만들 수 있습니다
그룹에 속한 인원을 볼 수 있고
해당 그룹에 올라온글에 반응과 댓글을 남길 수 있습니다.
또한 남의 다이어리에 스티커를 붙일 수 있습니다





일기 작성

유저는 텍스트와 사진을 첨부하여 일기를 작성할 수 있고 해당 일기를 원하는 그룹에 동시에 올릴 수 있습니다.
혹은 아무것도 선택하지 않고 개인일기에만 저장할 수 있습니다
일기 작성이 마무리 되고 나면 가지고 있는 스티커를 원하는 위치에 붙일 수 있습니다.

 





마이페이지

프로필 수정을 통해 프로필 이미지와 닉네임과 소개글을 수정할 수 있고 설문조사를 다시 할 수 있습니다
달력에 본인이 작성한 날짜에 감정 이모지와 본인이 일기에 자주 쓰는 키워드들은 크게, 많이 사용하지 않은 단어들은 작게 워드 클라우드를 제공해줍니다
또한 일기를 작성한 날짜의 이모티콘을 확인하여 그 날의 일기 디테일을 볼 수 있습니다.





3. 시스템 아키텍쳐

저희는 향후에 서비스 규모가 커진다고 가정하였을 때를 고려하여 어플리케이션 로드 밸런서를 사용하여 http 트래픽에 대해 로드 밸런싱을 하기 때문에 경로를 확인하고 해당 서버에 적절하게 트래픽을 분배 할 수 있었습니다.

 





4. 팀원 소개

 

 

  • 유클리드 호제법을 이용해 최대공약수를 구한 뒤, a와 b를 곱한값에 최대공약수를 나눠 최소공배수를 구했다
a,b = map(int,input().split())

c = a*b

while b > 0: # 유클리드 호제법
    a, b = b, a % b 

print(int(c/a))

 

'Python > 백준' 카테고리의 다른 글

[백준/Python] 1339. 단어 수학  (0) 2023.10.12
[백준/Python] 4179. 불!  (0) 2023.08.04
[백준/Python] 12761.돌다리  (0) 2023.03.03
[백준/Python] 13565. 침투  (0) 2023.03.02
[백준/Python] 6593.상범 빌딩  (0) 2023.02.28

프로젝트 명

 

프로젝트 소개

 

요즘 정말 많은 2030 세대가 주식투자를 하고 있습니다. 2021년 설문에서는 성인 3명 중 2명이 주식투자를 한다는 결과가 나오기도 했습니다.
이렇게 많은 사람들이 리스크를 감수하면서 돈을 투자하는데,얼마나 전문적으로 투자를 하고 있을까요?
저희가 사전에 유저들을 상대로 한 설문에서, 63%의 응답자가 전혀 경제 경영 관련 전문적인 교육을 이수한 적이 없다고 답했습니다.
전문적인 교육을 받지 않았다면 어디에서 주로 지식을 습득할까요?설문결과에 따르면 온라인 커뮤니티와 주변 지인이 상위 2개 응답인 것을 확인하실 수 있습니다.이러한 출처들은 전문성이 있는 정보와 없는 정보를 판별하기가 매우 어렵기 때문에 투자자들에게 혼란을 더 야기하곤 합니다.
그런데, 친구들과 온라인 커뮤니티에서 주식 관련 지식을 습득하는 재미는 동일하게 가져가면서,더 전문적인 정보를 바탕으로 투자할 수 있다면 어떨까요?
투자의 진입장벽을 낮추면서! 쉽고 재미있고 투자자들에게 양질의 정보를 제공하는 투자 연습 사이트 그게 바로 저희 리턴즈입니다.

 

프로젝트 소개 UCC

 

 

진행기간

  • 2023.02.20 ~ 2023.04.07(총 7주)

 

팀원 구성 및 역할

 

 

 

 

 

기술 스택

 

  • Front-end
    • JSX / CSS / JavaScript
    • React / Redux
    • Tailwind
    • Styled-component
  • Back-end
    • Spring / SpringBoot
    • JPA
    • AWS (EC2)
  • BataBase
    • Redis
    • MariaDB
  • Distributed Computing
    • Spark
    • hadoop
  • Tools
    • Jenkins
    • SonarQube
    • Zeplin

활용 API

  • Yahoo query
  • ALPHA VANTAGE

 

피그마 디자인

ERD

서비스 기능

(담당기능은 색깔 표시)

 

  • 로그인
  • 회원가입

  • 메인페이지 
    • 실시간 달러 환율, 일본 환율, 유로 환율, 비트코인, 원유 가격 확인 가능
    • 수익률 TOP 10 표시
    • 오늘의 추천 종목 표시
    • 오늘의 단어 표시

  • 튜토리얼페이지
    • 게임 진행방식 설명

튜토리얼

  • 게임 대기방
    • 여러 테마 설정 가능
      • 테마별 설명
      • 사용자가 원하는 날짜를 설정할 수 있음
    • 친구 초대 가능
    • 친구와 채팅 가능
    • 유저의 평균 수익률 표시

  • 게임 내부
    • 과거의 환율, 한국금리, 미국금리 표시
    • 각 컴포넌트 별 도움말 표시
    • 게임에 상장종목 랜덤으로 10개 표시
      • 전턴대비 상승, 하락 대비 표시
      • 매수, 매도 시 모달 표시
        • 자신이 보유한 종목 표시
          • 평가손익, 매도가능(보유 수), 손익률, 평균단가, 평가금, 매입금 표시
          • 전턴대비 상승, 하락 대비 표시
        • 현재 턴 표시
        • 현재 턴 남은시간 표시
        • 주식 그래프, 거래량 시각화
        • 선택된 종목의 간략한 소개
        • 선택된 종목의 주가 정보
        • 선택된 종목의 해당하는 날짜의 뉴스
        • 게임에 참여한 유저들의 총 평가자산 및 등수 표시
        • 레디 기능
          • 참가자가 모두 레디가 완료되거나 제한시간이 지나면 다음턴으로 넘어감
        • 유저들끼리 실시간 채팅

실시간 채팅

  • 결과 페이지
    • 최종 등수 확인
    • 프로필사진 해금
    • 선택한 유저의 수익률 추이 그래프와 턴 매수매도 데이터 확인

 

  • 사이드바
    • 친구 닉네임을 검색하여 추가 가능
    • 친구 요청 수락 거절 가능
    • 게임 초대 수락 거절 가능
    • 친구 온 오프라인 상태 실시간 확인 가능

  • 404 페이지
    • 에러 메세지 출력 후 메인페이지로 이동

프로젝트 명

프로젝트 소개

🤚 안녕하세요 ! 저희 팀은 움짤 공유, 탐색, 그리고 채팅 서비스인 Zzalu를 만들었습니다.

Zzalu의 유래는 Zzal + U 로 짤과 너와 잇다라는 뜻을 가지고 있습니다 !

짤로 소통하는 고독방,
매일 개설되는 제목학원,
마지막으로 프로필에 전시되는 본인의 짤BTI까지!
저희 서비스의 "제목학원"에 참여하여 드립력을 뽐내주세요!

그럼 저희 프로젝트 일상의 모든 순간을 짤로! Zzalu 를 소개하겠습니다

주제 선택 이유

여러분들과 실시간으로 소통하면서 자유롭게 놀 수 있는 그러한 공간을 만들고싶었습니다.

하지만 그저 ‘즐거움’으로 비롯된 것은 아닙니다.

비의 깡의 gif가 불러온 역주행 , 그리고 giphy가 무려 5000억에 페이스북에 인수되었다는 사실!

움짤은 그저 개인이 재미를 느낄 수 있을 뿐만 아니라 실제로 수익성도 있을 수 있는 서비스라는 점입니다.

움짤, 밈은 시장성과 수요는 넘치지만 아직 다른 서비스가 선점하지 않았다고 판단했고,

저희는 저희만의 차별성을 더하면 이 서비스가 앞으로 실제 프로덕트로도 충분히 발전 가능이 있다 생각하여 프로젝트를 진행해 보았습니다 :)

프로젝트 소개 UCC

(유튜브 링크)

 

진행기간

  • 2023.01.03 ~ 2023.02.17(총 7주)

팀원 구성 및 역할

기술 스택

  • front-end
    • HTML / CSS / JavaScript
    • Vue / Vuex
    • Tailwind
    • PostCss
    • ApexChart
  • back-end
    • Spring / SpringBoot
    • AWS (EC2)
    • Gradle
    • ZooKeeper
    • kafka
  • DataBase
    • Redis
    • MariaDB
  • Tools
    • Jenkins
    • Docker
    • JIRA
    • GitLab

활용 API

  • GIPHY

와이어 프레임

ERD

서비스 기능

(담당기능은 색깔 표시)

  • 로그인
    • 이메일 인증메세지를 통한 회원가입

 

 

  • 메인페이지
    • 제목학원 명예의 전당
      • 해당 제목학원의 1등한 유저의 아이디, 댓글 받은 좋아요 수 출력
    • 사용자 맞춤 추천 짤 리스트
      • 롱클릭 시 조회수, 즐겨찾기 유/무 확인, 보드 저장
    • 오늘의 인기 짤 리스트
      • 롱클릭 시 조회수, 즐겨찾기 유/무 확인, 보드 저장
    • 오늘의 핫한 고독방 리스트
      • 클릭 시 상세 내용 조회 가능

 

 제목학원이란 ?
    유머 짤에 재치있게 적절한 제목을 달아준 사람에게 마치 학원에서 배운 것처럼 제목을 잘 달았다는 데에서 온 말
  • 제목학원
    • 웹 통신을 통한 실시간 댓글 확인 및 실시간 좋아요 반영
    • 인기순 / 최신순 / 과거순으로 댓글 정렬
    • 대댓글 작성 가능
    • 다른 탭에서 새로운 댓글이 조회될 때 알림
    • 댓글의 작성시간을 알려줌
    • 역대 제목학원
      • 과거의 제목학원의 짤, 1등한 유저의 아이디, 댓글 받은 좋아요 수 출력
      • 디테일 페이지 확인 가능 ( 더 이상의 댓글 입력 불가 )

 

  • 짤 상세페이지
    • 짤 조회수, 짤에 해당하는 태그, 짤의 유래, 관련 링크, 짤을 마지막으로 수정한 사람의 아이디, 짤을 마지막으로 수정한 날짜 조회 가능
    • 보드에 스크랩 가능
    • 로그인 상태라면 편집 가능
      • 편집 시, 해시태그 추가 제거 가능
      • 짤의 유래 수정 가능
      • 관련 링크 (유튜브 등으로)링크 가능
      • 무분별한 수정 방지를 위해 바로 수정되는게 아닌 관리자에게 수정 요청 전송

 

 고독방이란 ?
    카카오톡 등 SNS에서 아이돌 덕후들이 스타를 응원하기 위해 만든 오픈 채팅방으로 텍스트 채팅없이 오직 짤로만 대화하는게 특징이다

  • 고독방 
    • 고독방 생성
    • 고독방 필터링
      • 1차 : 검색
      • 2차 : 전체 / 내가 개설한 / 즐겨찾기(좋아요)
      • 3차 : 최신 대화순 / 좋아요 순
      • 3차로 구성된 필터링을 통한 자신이 원하는 조건의 고독방 서치 가능
      • ex) "짱구"를 검색한 후, 즐겨찾기, 좋아요순을 누른다면 짱구 고독방 5개중 좋아요한 3개의 고독방을 좋아요 순으로 정렬해줌
    • 고독방 디테일
      • 방장, 고독방제목, 고독방 소개, 고독방 해시태그, 최신 대화시간, 나의 좋아요 여/부, 좋아요 총 개수 조회 가능
    • 고독방 내부
      • 과거 채팅 기록 불러오기
      • 고독방 좋아요/좋아요취소 가능
      • 서치모달에 본인의 보드를 포함해서 랜덤짤 출력
        • 고독방 내부에선 짤 클릭시 짤 디테일로 가는게 아닌 전송 유무를 표시
      • 나의 메세지와 다른 유저의 메세지 구분
      • 채팅을 친 사람이 방장이라면 방장표시
      • 채팅 시간 표시
    • 고독방은 3주 이상 활동이 없는 방이면 자동 삭제

 

 

 

  • 프로필
    • 내 정보 수정을 통해 닉네임 수정
    • 팔로워, 팔로잉 확인 가능
      • 다른 유저의 프로필이라면 팔로잉가능
    • 자신의 프로필 이미지, 아이디, 닉네임, 관리자 여/부 확인 가능
    • 짤BTI 확인 가능
      • 고독방 내 짤 사용, 보드 저장 데이터를 통해 짤BTI 출력
      • ex) TV와 관련된 데이터 빈도수가 높다면 짤BTI에 '뭐해? 나 누워서 TV봐..' 가 나옴
      • 해당 데이터를 apex graph를 통해 시각화
    • 자신의 제목학원 수상내역 확인가능
      • 제목학원에서 수상한 기록들이 저장됨
      • 인기순/최신순 정렬가능
    • 유저가 저장한 보드 확인 가능
      • 자신의 프로필이라면 보드 이름 수정, 보드 내부 짤 삭제 가능

 

 

 

  • 짤 업로드
    • 원하는 짤 선택 후 태그와 유래 링크 입력 후 관리자에게 업로드 요청

 

  • 관리자 기능
    • 유저의 업로드 요청, 짤 수정 요청을 확인 가능
    • 승인이 5회 이상이라면 수정,업로드 반영
    • 한명이라도 거절을 누르면 요청 취소

  • 기타 기능
    • 다크모드
      • 모든 UI가 다크모드로 바뀜 
        • 서치 모달
          • 랜덤 짤방 출력
          • 롱클릭 시 조회수, 즐겨찾기 유/무 확인, 보드 저장
          • 스크롤 이동 시 무한 스크롤
          • 검색
        • 보드 모달
          • 보드 추가 가능
          • 원하는 보드에 다중 저장 가능
        • 404페이지 / 500페이지 / 로그인 필요 페이지

 

 

 

  • 이동할 수 있는 경우의수가 8가지가 있는데 각각 방문표시를 하며 풀었다
from collections import deque

used = [0] * 100001

A,B,N,M = map(int,input().split())
q = deque([N])
while q:
    tmp = q.popleft()
    if tmp == M:                                   # 해당위치가 목표지점이라면 break 
        result = used[tmp]
        break
    if tmp - 1 >= 0 and used[tmp - 1] == 0:
        used[tmp - 1] = used[tmp] + 1
        q.append(tmp - 1)
    if tmp + 1 <= 100000 and used[tmp + 1] == 0:
        used[tmp + 1] = used[tmp] + 1
        q.append(tmp + 1)
    if tmp - A >= 0 and used[tmp - A] == 0:
        used[tmp - A] = used[tmp] + 1
        q.append(tmp - A)
    if tmp - B >= 0 and used[tmp - B] == 0:
        used[tmp - B] = used[tmp] + 1
        q.append(tmp - B)
    if tmp + A <= 100000 and used[tmp + A] == 0:
        used[tmp + A] = used[tmp] + 1
        q.append(tmp + A)
    if tmp + B <= 100000 and used[tmp + B] == 0:
        used[tmp + B] = used[tmp] + 1
        q.append(tmp + B)
    if tmp * A <= 100000 and used[tmp * A] == 0:
        used[tmp * A] = used[tmp] + 1
        q.append(tmp * A)
    if tmp * B <= 100000 and used[tmp * B] == 0:
        used[tmp * B] = used[tmp] + 1
        q.append(tmp * B)


print(used[tmp])

 

 

 

왜 틀렸을까 ?
  • 인덱스에러, 문제에선 10만번까지 갈 수 있는데 if문에서 100001까지 범위를 지정하여 인덱스에러가 났었다.

'Python > 백준' 카테고리의 다른 글

[백준/Python] 4179. 불!  (0) 2023.08.04
[백준/Python] 13241.최소공배수  (0) 2023.04.12
[백준/Python] 13565. 침투  (0) 2023.03.02
[백준/Python] 6593.상범 빌딩  (0) 2023.02.28
[백준/Python] 2467. 용액  (0) 2022.12.23

정규표현식의 코드 구성은 두개의 / 사이에 패턴을 넣는방식이다.

 

정규표현식에서 사용하는 패턴은 다음과 같다.

패턴 의미
a-z 소문자 알파벳이 포함되어있는지
A-Z 대문자 알파벳이 포함되어있는지
ㄱ-ㅎ 자음만 있는 한글이 포함되어있는지
가-힣 한글이 포함되어있는지
0-9 0-9까지의 숫자가 포함되어있는지
\d 숫자가 포함되어있는지
\D 숫자가 포함되어있지 않은지
\w 언더바( _ )와 숫자, 대문자 알파벳, 소문자 알파벳이 포함되어 있는지
\W 언더바( _ )와 숫자, 대문자 알파벳, 소문자 알파벳이 포함되어 있지 않은지
\s 공백(space)이 포함되어 있는지
\S 공백(space)이 포함되어 있지 않은지
\특수문자 해당하는 특수문자가 포함되어있는지

 

 

다음은 데이터 값이 영어 소문자가 포함되어있는지를 확인하는 간단한 예제이다.

const regex = /[a-z]/

console.log(regex.test('abc')); # true
console.log(regex.test('aBc')); # true
console.log(regex.test('ABC')); # false
console.log(regex.test('123')); # false

 

예제에서 알 수 있다시피 조건이 맞다면 true가 반환이 된다.

 

만약 조건을 여러개를 두고 조건에 부합하지않을 때, 무언가를 출력하고싶다면 다음과 같이 코드를 작성하면 된다.

 

const regex = /[\s|ㄱ-ㅎ|가-힣|a-z|A-Z|0-9]/

if (regex.test(data) == false) {
  실행할 코드 ~
}

 

 

 

  • bfs(Flood Fill)을 이용하여 풀었다.

 

from collections import deque

N,M = map(int,input().split())
flag = "NO"												# flag값 설정
arr = [list(map(int,input())) for _ in range(N)]

def bfs(j,i):

    global flag
    q = deque([(j,i)])

    directY = [-1,1,0,0]
    directX = [0,0,-1,1]

    while q:
        y,x = q.popleft()

        for k in range(4):
            dy = directY[k] + y
            dx = directX[k] + x

            if dy < 0 or dy >= N or dx < 0 or dx >= M:  # 범위를 벗어난다면 continue
                continue
            if arr[dy][dx] == 0 and (dy == N-1):        # bfs를 돌다 제일 아래 쪽(inner side)에 도착하게 되면 flag 값 변경
                flag = "YES"
                arr[dy][dx] = 1
                q.append([dy,dx])
            elif arr[dy][dx] == 0:
                arr[dy][dx] = 1
                q.append([dy,dx])


for i in range(M):
    if arr[0][i] == 0:              # 침투가 가능한 제일 위쪽 (outer side)만 탐색하여 0이라면 함수 실행
        arr[0][i] = 1
        bfs(0,i)

print(f"{flag}")

 

 

왜 틀렸을까?
  • bfs 함수에 들어가기전 if문 조건에 오타가 있었다. if arr[0][i] == 1: 로 잘못 입력했었는데도 채점이 50%이상 진행되어서 이쪽 부분을 다시 볼 생각을 못했다. 

 

'Python > 백준' 카테고리의 다른 글

[백준/Python] 13241.최소공배수  (0) 2023.04.12
[백준/Python] 12761.돌다리  (0) 2023.03.03
[백준/Python] 6593.상범 빌딩  (0) 2023.02.28
[백준/Python] 2467. 용액  (0) 2022.12.23
[백준/Python] 17086. 아기상어 2  (0) 2022.12.20

+ Recent posts