본문 바로가기
  • 커뮤니티
  • 블로그
  • 북마크

전체보기757

[1인 기업]프런트엔드(Front-End) 개발자의 1인 기업 라이프 1인 기업을 한 지 2년 8개월 정도 된듯하다. 과연 나는 잘하고 있는 걸까? 종종 나 자신에게 질문을 하곤 한다. 1인 기업형태로 비즈니스 모델로 만드는 게 궁긍적인 목적인데, 현시점에 분명한 건 기업형태는 아닌 거 같다. 왜냐면 프리로 2년가량을 일하고 있기 때문이다. 굳이 내가 움직이지 않아도 수익이 들어오는 구조를 생각했는데, 현재는 내가 움직여야 하는 구조가 돼버린 듯하다. 생각의 차이일까? 사업자를 내고 프리를 하면서도 세금계산서를 발행하고 직장이 아닌 직업을 갖고 있는 건 맞는데, 일하는 방식을 보면 직장인과 별반 다르지 않다는 생각이 든다. 1인 기업 프리랜서와 직장인의 차이는? 직장인이나 프리로 일하는 분들의 고민 중에 하나가 프리를 할 것인가 직장인으로 계속 남아있을 것인가? 고민하는 .. 2023. 5. 17.
[블로그 운영팁]티스토리 ‘오늘까지 블로그 몇일 운영한지’ 보여주기 블로그 운영 며칠 되었는지 보여주는 소스입니다. 꼭 블로그가 아니더라도 사이트도 될 수 있고, D-day로 응용 가능합니다. 티스토리 기준으로 설명하겠습니다. 먼저 안에 아래 코드를 넣으세요. 위에 '블로그 개설일'은 본인 블로그 오픈 날짜로 변경해주세요. 다음으로 사이드바에 전체 방문자 보여주는 곳에 아래 코드를 넣으세요. 전체 방문자 Today : [!##_count_today_##] Yesterday : [!##_count_yesterday_##] [!##_count_total_##] 블로그 개설일 : 2007년 2월 27일 오늘까지 일 운영중 // 해당 부분입니다. 위에 [!##_count 이 부분에서! 는 없애고 적용해 주세요. (치환자를 넣었더니 변경되는 걸 방지하기 위해! 를 임시로 넣은 것.. 2023. 5. 16.
[Javascript] ECMAScript 버전별 출시 연도와 추가된 주요 기능들 ECMAScript의 다양한 버전과 그 특징을 보여주는 표입니다. ECMAScript 버전 출시 연도 주요 기능 1 1997 기본 문법, 변수, 함수, 객체 2 1999 클래스, 이터레이터, 정규식 3 2001 프로토타입 상속, 객체 지향 프로그래밍 5 2009 함수 표현식, 제네릭 함수, 람다 함수 6 2015 모듈, 클래스, 타입스크립트 7 2016 async/await, 화살표 함수, 전역 컨텍스트 8 2017 스프레드 연산자, 템플릿 문자열, 옵셔널 체크 9 2018 BigInt, String.prototype.includes(), String.prototype.matchAll() 10 2019 Object.entries(), Object.values(), Object.fromEntries() 1.. 2023. 5. 14.
[자전거]2023년 구리시 한강시민공원 유채꽃축제 공연 나들이 (구리 유채꽃 한강예술제) 2023년 5월 12~14일까지 이번 연도도 여김 없이 구리시 한강시민공원에서 유채꽃축제가 열렸다. 이때다 싶어 날씨도 좋고해서 오랜만에 자전거를 끌고 나갔다. 일단 충전을 하고 장비(?)를 챙기고 출발 작년 자전거로 출퇴근할때 항상 이곳에서 잠시 쉬어갔는데 저기는 한강물을 코앞에서 만질 수 있어서 좋다. 구리시 갈매에서 자전거 도로로 가는 중에도 유채꽃이 여기저기 피어있어서 구리시민공원까지 가지 않고 여기서 구경하는 사람들도 꽤나 있었다. 자전거 탈때 꼭 챙겨가는 고프로! 유채꽃이 보이길래 급히 영상을 켰다. 오늘따라 햇볕이 뜨거웠고, 반팔을 입었는데도 더울 정도였다. 가족단위가 많았고, 탠트와 돗자리 자리는 이미 만석이었는데, 축제가 있는 날은 오전에 미리 가 있는 걸 추천한다. 오늘이 마지막 날이고.. 2023. 5. 14.
[AI]OpenAI ChatGPT와 구글 바드(Bard)는 무엇이고 차이점과 본인의 선택은? 검색하면 구글(google)이었는데, Open AI에서 개발한 ChatGPT가 출시되면서 전 세계적으로 검색에 대한 생각이 많이 바뀌고 있다. 대략 12년 전쯤 '구글드(googled)'라는 책에서 구글에서 말하는 최고의 검색은 '말하는 검색'이라는 글을 본 기억이 난다. 아이언맨에서 자비스에게 말(검색)을 하면 대답을 해주는 것처럼 말이다. AI 스피커가 세상에 나오면서 '이제 시작됐구나!'라고 생각했는데, 스피커로 답변해주는 것과 문서로 검색해 주는 건 분명한 차이가 있다. 물론 말로 답변해 준걸 인쇄나 실제 무언가를 제작을 해준다면, 같은 맥락이라고 볼 수도 있겠다. 그렇다면 전 세계적으로 떠들석하게 했던 ChatGPT란 무엇이고 구글의 바드(Bard)란 무엇인가? 그리고 앞으로 어떤 변화가 있을지.. 2023. 5. 14.
[AI]카카오톡으로 chat GPT 가져오기 (메신저봇 사용) 요새 chat GPT가 대세죠. 현재는 GPT를 통해 다양하게 이용중인데요. 저역시 업무간에 코드오류 체크, 생성등 너무 효율적으로 잘사용하고 있습니다. GPT란 GPT는 "Generative Pre-trained Transformer"의 약어로, 인공지능 언어 모델 중 하나입니다. GPT 모델은 대규모 텍스트 데이터를 학습하여 문장 생성, 번역, 요약 등의 자연어 처리 작업을 수행할 수 있습니다. GPT 모델은 OpenAI에서 개발되었으며, 최근에는 GPT-3 모델이 출시되어 많은 관심을 받고 있습니다. 먼저 (https://chat.openai.com/) 에 가입하셔서 무료로 사용을 해보시면 이해가빠를겁니다. 준비사항 1. 안드로이드폰 (공기계) 2. 카카오 계정 3. chat GPT API 카카오톡.. 2023. 5. 13.
[IT뉴스]2022년까지 프론트엔드 프레임워크와 라이브러리 프론트엔드 프레임워크와 라이브러리가 너무 많다보니, 공부할게 참 많네요. ㅎ 2022년에는 어떤 프레임워크를 많이 사용하고 있는지 39,471명이 설문조사에 참여했습니다. (통계를 보니 60%이상이 미국사람이네요.) 다음은 시간에 따른 인지도, 사용량, 관심도, 만족도 비율에 따른 통계자료입니다. 인지도 인지도는 해당 프레임워크나 라이브러리를 들어본적이 있는가? 입니다. React와 Vue.js가 1,2위를 달리고있네요. 통계를 보니 저도 한번도 듣지도 못한 프레임워크가 많네요. 사용량 사용량은 다시 사용할 예정 + 다시 사용안한다는 통계치입니다. React가 앞도적으로 수치가 높습니다. 뭐 거의 프론트엔트 프레임워크의 대장이라고 할수 있겠네요. 관심도 관심도는 배우길 원하거나 관심없다는 통계입니다. S.. 2023. 5. 12.
[블로그 운영팁]네이버 검색시 탭메뉴 형태로 노출되게 하려면 네이버 검색 시 탭메뉴 형태로 노출되게 하는 방법입니다. 이해를 돕기위해 스크린샷을 참고하세요. [미리보기] 검색 화면을 보시면 '요즘 시대의 단독주택이란?' 처럼 탭메뉴가 생성된걸 보실 수 있습니다. 위처럼 하기 위해서 블로그에 글을 작성하실때 제목(본문) 태그를 이용해서 제목을 작성하시면 됩니다. 티스토리 기준으로 상단에 제목태그를 이용하시면 되고, 에디터가 없는경우는 로 제목을 감싸주시면 됩니다. 제목문구 제목태그 위처럼 제목을 태그로 감싸주면 네이버 검색시 탭형태로 노출됩니다. 추가 설명을 드리자면, html도 문서입니다. 웹페이지이기 때문에 웹문서라고 합니다. 문서를 만들때 제목,본문을 구분하듯이 웹에서도 의미있는 마크업을 통해 웹페이지를 작성(코딩)합니다. 이것을 시멘틱웹이라고 합니다. 이렇게.. 2023. 5. 11.
[javascript]윈도우(맥OS) or 모바일 다크모드일때 dark-style.css 호출하기 윈도우(맥OS)나 모바일 다크모드일때 자동으로 감지 후 dark-style.css를 호출하는 방법입니다. JAVASCRIPT 위처럼 다크모드일때 웹페이지에서 dark-style.css를 호출하기위해 javascrpt에 아래 코드를 삽입합니다. if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { // 다크 모드이므로 dark.css를 호출합니다. const link = document.createElement('link'); link.rel = 'stylesheet'; link.href = 'dark.css'; document.head.appendChild(link); } HTML html을 보시면 아래와.. 2023. 5. 11.
[Jquery]부트스트랩(Bootstrap)과 제이쿼리(Jquery)의 버전별 호환성 부트스트랩과 jQuery의 버전 호환성은 부트스트랩 버전에 따라 다릅니다. 아래는 부트스트랩의 여러 버전과 그에 맞는 jQuery 버전을 요약한 표입니다. Bootstrap Version Compatible jQuery Version 5.x.x 3.5.1 or higher 4.x.x 3.2.1 or higher 3.x.x 1.9.1 - 3.5.x 2.x.x 1.7.1 - 1.9.1 1.x.x 1.3.2 - 1.9.1 즉, 사용 중인 부트스트랩의 버전에 따라 호환 가능한 jQuery 버전이 결정됩니다. 예를 들어, Bootstrap v4.0.0을 사용하고 있다면 jQuery 버전 3.2.1 이상을 사용하는 것이 좋습니다. 2023. 5. 9.
[VS Code]비주얼 스튜디오 익스텐션 sftp, ftp를 이용해서 바로 업로드해 보자 에디트플러스를 사용했을땐 저장하면 바로바로 서버에 업로드되서 편하게 코딩했던거 같습니다. VS Code를 사용하면서도 동일하게 가능합니다. 경로 혹은 설정을 잘못해서 저장 후 파일을 하나씩 올리고 있었다면, 아래방법데로 해보세요. 로컬에서 파일을 저장하면 바로 서버에 올라가게 하는 방법입니다. (모르시는 분들을 위해) SFTP 익스텐션 설치하기 VS Code 익스텐션에서 sftp를 다운로드 받습니다. (여러 ftp 설치파일을 사용해봤지만 개인적으로 이게 편하더군요.) 프로젝트 생성 로컬 프로젝트 폴더를 여시고 설정파일을 생성해야합니다. 그후 설정에서 SFTP:Config를 선택합니다. (윈도우 : ctrl + shift + p 맥 : command + shift + p) 설정 화면이 보이면 아래와 같이 .. 2023. 5. 8.
[잡담]매일 한시간의 중요성 어느순간부터 시간을 매우 중요하게 생각하는 시점이 있었다. (사실 꽤 오래되긴 했다) 여러 책들과 영상을 통해 성공한 사람들의 이야기를 듣다가 공통점을 발견했기때문이다. 그것은 시간이었다. 이건 나이,신분,직업하고 상관없이 어느곳에서든 동일하게 시간은 존재하고 그에 따른 결과가 다를뿐이다. 영어를 잘하고 싶으면 매일 한시간씩 영어를 공부하면 될것이고, 그림을 잘그리고 싶으면 한시간씩 매일 그림을 그리는 것이다. 개발자라면 매일 프로그래밍을 공부하면 될것이며 다이어트가 목적이고 건강한 몸을 유지를 하고 싶다면 매일 산책하고 식단조절을 하면 될것이다. 파워블로그가 되고싶다면, 매일 한시간씩 포스팅을 하면 어느순간에 파워블로거가 되어있을것이다. 다시말해, 본인이 목표하거나 좋아하는걸 매일 한시간씩만 하면 된다.. 2023. 5. 7.
[잡담]조용히 살고싶은곳! 양주 7호선 옥정중앙역(예정) 단독주택 파티오포레 예전에는 도심지가 좋았는데, 한두살 먹으면서 조용한곳을 찾게 되더군요. 살면서 단독주택에 살고싶다는 로망은 한번씩 가져봤을텐데요, 단독주택하면 제일 먼저 생각나는것이 직장까지의 거리, 벌레, 근처 편의시설등이 떠오릅니다. 물론 장점도 있지만, 현실적으로 걸림돌이 많았던게 사실입니다. 그럼에도 불구하고 단독주택의 로망은 아직도 가지고 있는데요. 위에 단점을 보완해주는.. 홀로 단독주택이 아닌 대단지의 단독주택을 분양하는 곳이 있어 소개해봅니다. 단독주택이라 하면 말그대로 아파트처럼 위아래 눈치안보고 독립된 공간에서 사는게 매력인데요. 먹고사는게 먼저인지라 현실적으로 가능한지.. 생각을 안할수가 없었습니다. 요즘 시대의 단독주택이란? 시대가 바뀌면 생각도 바뀌어야하고, 그시대에 맞게 생각을 하는 사람이 성공.. 2023. 5. 7.
[React]리액트 자주사용하는 기본문법 React의 문법 React는 JSX(JavaScript XML) 문법을 사용하여 UI를 작성합니다. JSX는 JavaScript의 확장 문법으로, HTML과 유사한 문법을 사용하여 컴포넌트를 작성할 수 있습니다. 컴포넌트 생성 프로퍼티 전달 이벤트 처리 조건부 렌더링 배열 렌더링 스타일링 반복문 이벤트핸들링 컴포넌트 생성 React에서 컴포넌트를 생성할 때는, 함수형 컴포넌트를 작성할 수 있습니다. 이 함수는 JSX를 반환해야 하며, JSX는 괄호(())로 감싸야 합니다. jsx Copy code function MyComponent() { return Hello, World!; } 프로퍼티 전달 React 컴포넌트에는 프로퍼티(props)를 전달할 수 있습니다. 프로퍼티는 해당 컴포넌트가 렌더링될 때.. 2023. 3. 29.
[Javascript]ECMAScript6(ES6)에 추가된 문법 ES6 (ECMAScript 2015)은 ECMAScript 언어의 6번째 버전입니다. ES6는 많은 새로운 문법과 기능을 도입하여 JavaScript를 더욱 강력하고 유연한 언어로 만들었습니다. ES6에 추가된 주요 문법 몇 가지를 살펴보겠습니다. let, const 키워드: 기존 var 키워드 대신에 let과 const 키워드가 추가되었습니다. let은 블록 스코프 변수를 선언할 때 사용하며, const는 상수를 선언할 때 사용합니다. let x = 10; x = 20; // 가능 const y = 10; y = 20; // 불가능 화살표 함수: 화살표 함수는 함수를 더 간결하게 작성할 수 있도록 해줍니다. 이전에는 함수를 선언할 때 function 키워드를 사용해야 했지만, 화살표 함수에서는 이 키.. 2023. 3. 20.
반응형