본문 바로가기

전체 글77

[세미나] HTML, CSS, JavaScript개념 사내에서 진행했던 세미나 발표 자료, 스크립트 정리1. 웹의 역사와 세 가지 핵심 기술의 탄생1.1 웹의 탄생1990년: 팀 버너스-리가 최초의 웹 브라우저이자 편집기인 월드 와이드 웹을 개발.1991년: 팀 버너스-리는 첫 번째 웹사이트를 공개, HTML과 하이퍼링크 개념을 설명.1.2 웹의 발전과 세 가지 기술의 등장HTML: 1991년, 웹 페이지의 구조화와 정보 연결을 위한 마크업 언어로 등장.CSS: 1996년, 웹 페이지의 레이아웃과 디자인을 담당하는 기술로 도입.JavaScript: 1995년, 웹 페이지에 동적인 기능과 사용자 상호작용을 추가하는 언어로 도입.2. HTML2.1 HTML의 정의와 개념HTML: HyperText Markup Language의 약자, 웹 페이지의 구조와 내용을.. 2024. 8. 9.
[TIL] Redux-Toolkit, Redux-Persist 에러 A non-serializable value was detected in an action, in the path: `register`. 프로젝트 테스트 중 Redux-Toolkit과 Redux-Persist를 함께 사용하니 콘솔창에 계속 에러가 났다.chatGPT에게 물어보니 아래와 같은 답을 주었고 이해는 안 됐지만 에러는 해결함...const store = configureStore({ reducer: persistedReducer, middleware: (getDefaultMiddleware) => getDefaultMiddleware({ serializableCheck: { // 직렬화 확인을 무시할 액션 타입들을 설정합니다. ignoredActions: ["persist/PERSIST"], }, }),}); 2024. 6. 16.
[TIL] Vite-React-Eslint Prop-Types 검사 에러 없애기 프로젝트 프론트 테스트 중 Vite로 구축한 React 환경에서 컴포넌트에 props를 넘기는데'error' is missing in props validationeslintreact/prop-types위 에러가 계속 나서 내가 처음에 타입스크립트로 잘못 선택했나 싶었는데 에러창을 잘 살펴보니 eslint 에서 문제가 있는 것 같아 찾아봤다. 이유는 vite로 프로젝트 구축할 때 자동으로 생성되는 .eslintrc.cjs 파일의 extemds 부분에 있는 "plugin:react/recommended" 가 문제였다. 이 설정은 React 컴포넌트에서 PropTypes를 사용하여 props의 타입을 검사하도록 권장해서 PropTypes를 정의하지 않았을 때 경고 또는 오류를 발생시킨다고 한다. (출처 Ch.. 2024. 6. 14.
[백준] 1934번: 최소공배수 (JavaScript, node.js) [백준] 1934번: 최소공배수 (JavaScript, node.js)https://www.acmicpc.net/problem/1934https://github.com/jwc406/algorithm_Solving/tree/main/%EB%B0%B1%EC%A4%80/%EC%B5%9C%EC%86%8C%EA%B3%B5%EB%B0%B0%EC%88%98 algorithm_Solving/백준/최소공배수 at main · jwc406/algorithm_Solving알고리즘 풀이 저장소입니다. Contribute to jwc406/algorithm_Solving development by creating an account on GitHub.github.com let input = require("fs").readFi.. 2024. 5. 27.
[뉴딜IT인턴] 10일차 - 데이터 분석을 위한 파이썬 1 파이썬 기초서비스인프라 ⇒ 서버,네트워크,데이터베이스어플리케이션 ⇒ 3tier(쓰리티어)-Architecture프론트 : html, css, react, vue …백엔드 : java, python, spring, django, flask데이터베이스 : RDB(정형화된 데이터), NoSQL(정형화 X)파이썬 기본 기능package : 미리 만들어놓은 코드모음 (numpy, pandas …)# 변수 (Variable)소문자, 단어 연결은 _ ex) today_lunch숫자로 시작하면 안 됨예약어(id, range, str, sum, type) 사용 X실습 1# 제곱근 구하기# 방식 1. n**(1/2)# 방식 2. matH 라이브러리의 matH.sqrt() 사용import mathC = 50H = 30D =.. 2024. 5. 22.
[뉴딜IT인턴] 9일차 - 자바스크립트 서버 프레임워크(NodeJS) 실습 1. Node.js란?웹 브라우저 바깥에서(윈도우, 리눅스, macOS 등) 자바스크립트 코드를 실행할 수 있는 자바스크립트 런타임 환경자바스크립트 런타임 환경웹 브라우저 환경에서는 웹 페이지에 대한 사용자 인터페이스를 만들고, 사용자와의 상호작용을 관리하며, 웹 서버와의 통신을 처리하는데 사용됩니다. 브라우저의 자바스크립트 런타임 환경은 DOM(Document Object Model), 웹 API (예: Fetch API, Web Storage API 등), 이벤트 루프 및 콜 스택과 같은 요소를 포함합니다.따라서 자바스크립트 런타임 환경은 자바스크립트 코드가 실행되는 특정 컨텍스트를 제공하며, 코드가 어떻게 실행되고, 어떤 API가 사용 가능한지, 코드가 어떻게 스케줄링되고 관리되는지 등을 결정합니다.. 2024. 5. 20.
[프로그래머스] 삼각형의 완성조건(2) (Python3) https://school.programmers.co.kr/learn/courses/30/lessons/120868?language=python3 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.krdef solution(sides): answer = 0 biggest = max(sides) lowerst = min(sides) case1 = biggest+lowerst - 1 #다른 변 길때 case2 = biggest-lowerst + 1 #있는 변 길때 return case1-case2+1 2024. 5. 14.
[프로그래머스] 바탕화면 정리 (JavaScript) https://school.programmers.co.kr/learn/courses/30/lessons/161990?language=javascript 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.krfunction solution(wallpaper) { let fileLocation = []; // 파일 위치 배열 for(i=0; i{ xValues.push(coord[0]); yValues.push(coord[1]); }) const minX = Math.min(...xValues); const minY =.. 2024. 5. 14.
[노개북] IT 5분 잡학사전 - 4일차 TIL 240213 오늘 읽은 범위-> 에피소드 11 - 15 책에서 기억하고 싶은 내용-> 라이브러리와 프레임워크는 모두 누군가 미리 작성해 놓은 코드이고, 개발 속도를 빠르게 만들어 주는 도구라는 공통점이 있고, 이를 구분하는 가장 큰 차이점은 ‘누가 제어를 하는지‘이다. 도구를 어떻게 사용할지 내가 결정을 내리고 있다면 라이브러리, 누군가 정한 규칙에 따라 도구를 사용해야 한다면 프레임워크이다. 또한 다른 라이브러리로 교체하여도 큰 문제가 없다면 라이브러리, 교체하기 어렵다면 프레임워크이다. 하지만 어떤 기술에 대해 라이브러리인지, 프레임워크인지 판단하는 것은 중요치 않다. -> API 작동 방식의 특징은 사용하는 사람이 알 수 없다는 것 -> 도메인을 만드는 것은 레지스트리이며, 도메인 관리 비영리기구인.. 2024. 2. 14.
[노개북] IT 5분 잡학사전 - 2일차 TIL 240210 오늘 읽은 범위-> 에피소드 01 - 05 책에서 기억하고 싶은 내용-> 프로그래밍 언어는 목적에 맞게 공부해야 한다는 것 -> 각 프로그래밍 언어에 따라 개발 철학과 구조, 개념과 패턴이 달라 단순히 언어를 배우는 것 이외에도 많은 도움이 된다는 점 -> C# 언어가 C나 C++과 비슷하다고 생각했는데 오히려 자바와 비슷한 언어라는 점과, 다재다능한 언어라는 점 오늘의 소감-> 알고 있었던 내용도 재밌고 쉬운 설명 덕분에 더 기억에 남는 것 같고, 챌린지로 주어지는 분량이 많지 않아 부담 없이 읽고 정리하기에 좋았다. 2024. 2. 11.
[노개북] IT 5분 잡학사전 구매 인증! https://nomadcoders.co/it-dictionary 노개북 IT 5분 잡학사전 – 노마드 코더 Nomad Coders 노마드 개발자 북클럽 nomadcoders.co 설 연휴를 틈타 노마드 개발자 북클럽 챌린지 시작! 매일 강의 챌린지만 하다가 독서 챌린지는 처음인데 매일매일 강제로라도 책 읽는 습관을 들여보고 싶어서 신청해 보았다. 여담이지만 전에 신청했던 리액트마스터 챌린지는 졸업 작품을 못 제출해서 다시 신청해 놨는데, 마침 독서 챌린지와 기간이 겹쳐서 한 번에 챌린지 두 개를 하게 됐다... 노개북 챌린지는 오늘이 첫날이라 구매 인증부터 시작! 화이티잉 새해 복 많이 받으세요~! 2024. 2. 10.
[React JS 마스터클래스] #3 TYPESCRIPT 정리 #3.0 Introduction - 타입 문법과 함꼐하는 자바스크립트 - 추가 : 타입 체크, 자동 완성, 인터페이스, JSX 문법 - 언어 작동 전에 타입 확인함 => stongly-type - 브라우저는 자바스크립트만 이해할 수 있음 => 타입스크립트는 이해 X - 컴파일 시 자바스클비트로 변경 -> 실행 전에 타입 체크 하고 오류 알려줌 #3.1 DefinitelyTyped CRA로 타입스크립트 프로젝트 생성 1. [npx or yarn] create-react-app [내 앱 이름] --template typescript 2. yarn add styled-components 로 스타일드 컴포넌트 먼저 설치 3. yarn add @types/styled-components -D 으로 타입스크립트 타.. 2024. 1. 23.