전체 글 139

[ICT] ICT 리액트 웹 제작기 (2) Marker 커스텀

지난 포스팅에 보여준 웹 페이지 ! Marker Custom 카카오 문서에 보면 여러개의 마커 보여주기, 하나의 마커 커스텀하기 등 .. 내가 원하는 여러개의 마커를 보여주고 이 여러개의 마커를 커스텀 하는 내용이 없다 그리고 리액트에 적용하는 방법까지 그래서 .. 엄청난 구글링과.. 카카오에서 제공해주는 문서 이해와 .. chatGPT행님을 적극 활용하여 어찌저찌 만들었다 (소학의 마음가짐 : 어떻게든 되게 만들어야죠 .. ) (1) 이 코드를 어떻게 작성했냐하면 .. Map.jsx import React, { useEffect, useState } from 'react'; import Loading from './Loading'; import Info from './Info'; // import ma..

[ICT] ICT 리액트 웹 제작기 (1) 피그마와 지도 API따오기

ICT 창업 경진 대회에 나가게 되었다 .. 다른 팀원들은 아두이노를 맡고 나는 웹 .. 제작 .. 나 홀로 해커톤 Start ~~ !! 웹 GUI 내가 만들게 된 페이지는 주민센터용 확인 웹이다. Nomal, Caution, Warning 상태에 따라 각각 초록색, 노란색, 빨간색을 줄 것이다 .. 그 후 마커를 누르면 보호자 연락처와 병원 연락처가 뜨게 만들어줄 것이다 . 사실 붙을 줄 모르고있었기에(넘 바빴기에 붙지 않길 바라는 마음 반, 그래도 붙었으면 싶은 마음 반 .. ) 저기서 멈출 줄 알았다. 하지만 2차까지 붙게 되었고 ..~~!!! (좋지만싫지만좋지만 좋다 .. 햐 🥺🥺) 웹을 재빨리 제작하게 되었다 지도 API따오기 API하나쯤 따오는 건 누워서떡먹기 식은죽먹기~~ 하지만 !! 문제가..

[React] 리액트 배너 슬라이드 만들기(Swiper)

우리 프로젝트 웹 화면이 정적인 느낌이 강해서 .. 로딩 페이지에 이어 이번에는 홈 화면에 배너 슬라이드를 추가하였다. Swiper 사용하기 Swiper React Components Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com 여기서 다양한 방법을 만나볼 수 있다 ~ ! Swiper 설치 npm i swiper Swiper 사용법 // Import Swiper React components import { Swiper, SwiperSlide } from 'swiper/react'; // Import Swiper st..

FE/React 2023.05.29

[코테준비] KOALA 대회/코테 연습 1주차 후기

모의 코딩 테스트 .. 를 쳤다 .. 컨셉 : 카카오 코딩 테스트 (문자열 파싱 등) 난이도 : 실제 코딩테스트의 80~90% 정도 난이도와 컨셉은 이런느낌 3시간동안 10문제중 4문제를 해결했다 .. .. ㅜ - 우선 시간 잡고 푸는 연습을 해서 좋았다.. 그리고 한 문제 한 문제 토의하는 시간까지 !! 알찬 .. 시간이었다 .. 오늘은 비도 오고 나가기 싫어서 느적거리다가 집에서 좌식테이블에 앉아서 쳤는데 .. 다음부터는 준비 일찍 해서 약간의 긴장감 가지고 집중해서 풀어야겠다 !! - 문제 난이도를 가리고 시험을 쳐봤다. 약간 긴장된다.. 문제를 해결하고 나면 난이도가 보이는데 체감 난이도보다 훨씬 낮았다 (= 쉬운 문젠데 어렵게 보임 ) 1번 3004번: 체스판 조각 상근이는 3003번에서 동혁이..

[React] 리액트 로딩 페이지 만들기 (react-spinners)

프론트에서 API를 호출하여 가져오는 동안 페이지에 아무런 변화가 없으면 사용자들은 당황한다 .. `어 ..? 이게 되고 있는 것 맞나 ? ` 그래서 로딩 화면을 넣는데 .. 리액트에서 어떻게 넣을까 ! 고민하고 있었는데 라이브러리만 잘 쓰면 뚝딱하고 만들어진다 (라이브러리 최고 ~ ) React spinner 설치하기 npm install react-spinners 또는 npm install react-spinners --save 사용법 - Spinner 모양 선택하기 https://www.davidhu.io/react-spinners/ React Spinners www.davidhu.io 이 사이트에 들어가서 여러가지 스피너 중 마음에 드는 스피너를 선택하면 된다. 가장 기본적인 BeatLoader와..

FE/React 2023.05.24

[백준/Python] 2606번: 바이러스 (재귀 DFS 사용)

1. 문제 2606번: 바이러스 첫째 줄에는 컴퓨터의 수가 주어진다. 컴퓨터의 수는 100 이하이고 각 컴퓨터에는 1번 부터 차례대로 번호가 매겨진다. 둘째 줄에는 네트워크 상에서 직접 연결되어 있는 컴퓨터 쌍의 수가 주어 www.acmicpc.net 2. 코드 n = int(input()) # 노드 개수 size = int(input()) # n번 노드에 연결된 노드 graph = [[] for _ in range(n+1)] # 방문한 노드는 1, 방문하지 않은 노드는 0 visited =[0]*(n+1) for i in range(size): a,b = map(int,input().split()) # 그래프 넣어주기 ~ graph[a]+=[b] graph[b]+=[a] def dfs(v): # 방문한..

[알고리즘]/BOJ 2023.05.13

[컴퓨터 네트워크] Chapter4. Network Layer (2)

virtual circuit and datagram networks connection, connection-less service 데이터그램 네트워크 → connectionless service virtual-circuit network → connection service Network layer vs Transport layer (ex: Internet) Network layer vs Transport layer Host-to-host Service Process-to process Only one Choice(인터넷 프로토콜) Connection(TCP) and Connectionless(UDP) End-system and NW Core Implementation End-system Only Ab..

[운영체제/OS] L18. CPU Scheduling (2)

Shortest-Remaing-Time (SRT) : SRT는 SJF의 preemptive버전 Policy 가장 작은 다음 CPU burst를 가지는 프로세스를 고르고, 그 프로세스를 preemptive 하게 돌린다 .. termination or block할 때 까지, 또는 → 프로세스가 레디큐에 들어갈 때 까지(새로운 프로세스나 이전에 block된 프로세스) 이 시점에서 예상된 CPU burst 시간이 현재 CPU burst의 시간보다 작을 경우 실행할 다른 프로세스를 선택함 SRT Example ❓ Q. 수행도중 남은 잔여시간이 작은 프로세스에 CPU할당 , 실행하다가 멈추고 .. 이런건가 .. ? → ㅇㅇ 이론으로, 존재 실제로 존재한다면 오버헤드가 엄청날 것 … Q. SRT에서 스케쥴러가 잔여시..

[운영체제/OS] L17. CPU Scheduling (1)

CPU Scheduling Goals CPU scheduler must decide: 프로세스 실행 시간 프로세스들이 실행될 순서 User-oriented schdeuling policy goals : 유저관점에서 스케쥴링의 평가(기준) 평균 반응시간 (프로세스 실행시키고 첫번째반응이 일어날 때까지 걸리는 시간)을 최소화한다. 반면 interactive한 유저가 적절한 응답을 받는 수를 최대화한다. trunaround time(프로세스 시작 ~ 종료까지, execution time + waiting time) 최소화함 평균 응답 시간의 편차 최소화 예측가능성은 중요함 .. 프로세스는 어떤 시스템에 load 되었는지 상관없이 항상 (대략적으로) 같은 시간동안 실행되어야한다. System-oriented s..