전체 글 10

Footer에 html 전화걸기, 메일보내기 a href

[html / css] a 태그  footer에 나의 정보를 담고 싶어서 처음에는 단순히 이름, 전화번호, 메일주소를 기본으로 적고 링크에 나의 깃허브와 티스토리를 연결만 해놓을 생각이였다. 그러다 요즘 핸드폰에서 작업하는 경우가 많아 a 태그에 핸드폰번호와 이메일도 이동되도록 하는 경우가 많아 같이 적용을 해볼까 합니다. 태그란 태그는 href 특성을 통해 다른 페이지나 같은 페이지의 특정 위치, 파일, 이메일 주소와 그외 다른 url로 연결할 수 있는 하이퍼링크를 만드는 기능을 가진 태그이다. - href 속성 1. 태그 클릭시 이동하는 URL Google 2. 페이지 내부 영역을 가르키는 fragment URL 두번째 단락으로 가기 두번째 단락 3. tel: URL - 전화번호 010-0000-0..

Project 2023.04.12

[my-log] Start

시작전. 웹 페이지에 있을 법한 기본 기능들을 연습하기 위해 간단한 포폴겸 MUI 템플릿을 보며 만들어 보기로 했다. 일단 비슷하게 만들게 될 템플릿은 https://mui.com/store/previews/webbee-landing-page/ Webbee - Multipurpose landing page UI Kit - MUI Store A collection of the best React templates, React dashboard, and React themes. It includes templates for dashboard, admin, landing page, e-commerce site and more. mui.com 이다.

Project 2022.12.13

[pivot]React FullCalendar prev,next CustomButtons

FullCalendar에서 CustomButtons 사용하기 처음 원했던 기능 - 전달, 다음 달 버튼 누르면 그 달의 정보 가져오기 문제점 - 기본 버튼에 기능을 넣는 방법을 찾지 못함 홈페이지를 들어가도 이렇게 DOM Selector 함수나 JQuery를 사용하는 방법은 옳지 않은 것 같아 리액트의 React.useRef() 와 FullCalendar의 CustomButtons을 사용하여 직접 DOM에 접근해 보겠다. const calendarRef = React.useRef(); { calendarRef.current.getApi().prev(); //DOM에 접근해 전달로 이동 const day = _.get( calendarRef.current.getApi(),//DOM의 정보 가져옴 "curr..

Project 2022.11.15

[Nextjs] Pivot 프로젝트

프로젝트 동기 nextjs를 사용해보고 싶기도 했고 해보고 싶은 것들을 다 때려박기로 했다. 프로젝트 주 기능 SNS MMS 캘린더 클라우드 사용해 보고싶은 것 카카오, 네이버등 로그인 결제 시스템 (기본기능 X) 그룹 채팅 Next.js 프로젝트 생성하기 Next.js 프로젝트 생성하기 - npx create-next-app pivot 타입스트립트 적용 시키기 - yarn add --dev typescript @types/react @types/node import { AppProps } from 'next/app' import Layout from './components/Layout' function MyApp({ Component, pageProps }:AppProps) { return ( ) }..

Project 2021.11.01

Node.js 와 NVM

Node.js 탄생 배경 웹이 처음 만들어지고 많은 종이문서들을 웹페이지에 올릴 수 있게 되었습니다. 하지만 HTML을 직접 타이핑하고 수정하는 등, 수동으로 만드는 것에 불만을 느끼고 또 방문자들이 직접 글을 올릴 수 있었으면 좋겠으나 웹페이지의 파일을 직접 만지게 하는 것은 위험하여 웹사이트 소유자만이 웹페이지를 올릴 수 있었습니다. JavaScript 가 만들어진 후, JavaScript 에 의해 웹은 사용자와 상호작용할 수 있는 애플리케이션의 면모를 갖추게 됩니다. 문서로 시작했던 웹이 애플리케이션으로 확장이 된 것입니다. 하지만 이때까지는 JavaScript는 웹브라우저에서 사용할 수 있는 독립적안 프로그래밍 언어일 뿐이였습니다. 그 후 구글이 크롬 웹브라우저에서 동작하는 JavaScript의 ..

concept Learning 2021.10.01

프로그래머스 - 코딩테스트 연습 - 부족한 금액 계산하기

코딩테스트 연습 > 위클리 챌린지 >1주차_부족한 금액 계산하기 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다. 놀이기구를 count번 타게 되면 현재 자신이 가지고 있는 금액에서 얼마가 모자라는지를 return 하도록 solution 함수를 완성하세요. 단, 금액이 부족하지 않으면 0을 return 하세요.제한사항 놀이기구의 이용료 price : 1 ≤ price ≤ 2,500, price는 자연수 처음 가지고 있던 금액 money : 1 ≤ money ≤ 1,000,000,..

알고리즘 2021.10.01

10/1 하루 일과

1. 영어 공부 아침 - 문장 3개 2. 알고리즘 공부 ( 코딩 테스트 ) 오랜만에 코딩 테스트 연습을 시작했다. 오랜만에 시작하다 보니 머리가 정말 안 돌아갔다. 연습의 중요성! 계속 연습하면서 여러 문법을 익히고 생각하도록 해야겠다. 쉬운 문제를 풀어서 그런지 한 문제 더 풀고 싶지만 지금 해야 하는 게 너무 많다. 마음만 너무 급한 것 같다. 3. css 공부 겸 간단한 프로젝트 시작 vscode, Homebrew, NVM, nodejs, eslint, 프리티어 등 4. 면접 질문 ( 직무 관련 ) 프로젝트 시작 전 노트북을 바꾸는 바람에 필요한 것들을 다시 다 깔아줘야 했다. 깔면서 그에 대한 개념 공부하고 정리하다 보니 시간이 애매하게 되었다. 일단 기본적으로 필요한 프로그램만 다 깔고 시작해야..

하루일과 2021.10.01