전체 글 64

html 메일보내기 기능

포트폴리오를 만들다가 연락처를 적어야하는 상황이 왔다. 모든 정보를 다 까는건 불편해서 이메일만 공개를 하려고 했는데, 왜인지 form 태그로 정말 어떤 양식을 만들어서 올리는게 낫지 않을까 싶어 열심히 디자인해서 나에게 간단한 메시지를 보낼 수 있는 메일폼을 작성하였다. 보내는 사람 내용 전송 대략 이런 간단한 디자인이었는데 문제는 서버 없이도 내 포트폴리오 사이트에 방문한 사람이 나에게 메일을 보낼 수 있어야 한다는 것이었다. 구글에 html 메일 등으로 검색해서 찾아봤는데 다행히 정적 html로 메일 보내기 등의 제목으로 html에서도 충분히 서버 없이 메일을 보낼 수 있는 코드들이 나와 있었다. Sample: https://docs.google.com/spreadsheets/d/1Bn4m6iAXc..

HTML & CSS 2021.01.18

html / css 편집기 뭐가 괜찮을까?(visual studio code vs Brackets) 2

vs code를 많이들 사용하기에 나도 처음에는 vs code로 작업을 하다가.. 웹 퍼블리싱 특징상 마진이나 패딩의 영역을 정확하게 어느정도로 감을 잡고 해야할지 난감할 때가 있어 vs code가 마냥 모든 편의성을 제공하진 않는구나 싶었다. 그러다가 문득 학원 컴퓨터에 기본으로 설치가 되어있는 Brackets를 알게 되고 나서 신세계가 펼쳐졌다. 결론부터 말하자면 나는 notepad -> vs code -> Brackets -> vs code로 현재는 vs code를 이용하고 있다. 하지만 웹 퍼블리싱을 주로 하는 사람이라면 Brackets의 존재를 하루라도 빨리 알아야 한다!! 현재는 리액트를 공부중이고, 리액트 네이티브로 앱을 만들고자 하루에 설치만 수십번을 하고 빌드하고 난리부르스를 추는데, 터..

HTML & CSS 2021.01.17

[React-nitve] error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65. 해결방법

React-native로 앱 만들기를 시작하면서 수많은 오류를 맞딱뜨렸지만 이 것만큼 세고 해결도 잘 안되는 오류는 첨봤다. pod install이 잘 안된건가 싶어서 다시 해봤고, yarn도 다시 깔아보고 구글에 나와있는 에지간한거 다 해봤는데 결국 실패.. 누구는 프로젝트를 다시 깔았다고 했는데 나는 귀찮아서 그거까진 안했다. 해봤던 방법들을 나열해보자면 1. watchman 재설치 brew install watchman 실패! 2. cocoapod 재설치 sudo gem install cocoapods vi ~/.bash_profile .bash_profile에 가서 i버튼을 눌러 insert기능을 활성화 한 뒤 export GEM_HOME=$HOME/.gem export PATH=$GEM_HOME..

REACT 2021.01.13

개발일기#2 Node Sass 오류 고치기

이놈의 리액트는 진짜 짜증난다. 뭐 하나씩 하다보면 당연하게도 설치를 필요로 하는 것들이 있는데 이번엔 react-icon 설치하다가 갑자기 오류를 맞이하게 됐음.. mac Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (88) 이번에는 이런 오류였는데 아 느무느무 짜증나는 오류였다. 잘 되다가 갑자기 왜 이런 오류가 뜨는건지 모르겠는데 하튼 나의 맥새끼랑 버전이 뭐 안맞는다는 거겠죱.. 그래서 또 구글링 하다가 node-sass를 다시 까셈 이라는 말들을 보고선 열심히 삭제하고 다시깔고를 반복했는데도 계속 안되더이다. 내가 잘못생각한게 나는 그냥 내 컴터 ,그니까 터미널 켰을 때 기..

REACT 2021.01.12

개발일기#1 메인페이지 및 메뉴

블로그 개발을 앞서 어떤 메뉴들을 생성하고 어떤 내용들을 다룰지 한참을 고민했다. 뭐 내용이 알차고 나뿐만 아니라 많은이들에게 도움이 될만한 사이트라면 꼼꼼히 만들겠지만 지금은 넘나 머릿속에서 뒤죽박죽+혼돈의카오스인 내용들을 정리하면서 포트폴리오에 넣어볼만한 작은 사이트를 만드는거라 한시간 넘게 고민했는데 겨우 메뉴 두개 생각해냈음 \^0^/ 나는 우선 메인페이지 포함 세 개의 메뉴를 다루려고 한다. 맨 처음 대문에 들어서면 대략 이런 식의 디자인으로 보여지게 하고 싶었고, 이 내부는 왼쪽 헤더는 고정인 상태로 우측에서만 스크롤이 가능하게 하려고 했다. 따라서 컴포넌트 폴더를 따로 만들고 드디어 컴포넌트를 각각 나눠서 사용해보는 것이 내 첫 번째 목표라고 할 수 있다. 리액트로 넘어오면서 맨 처음에 헷갈..

REACT 2021.01.11

초짜가 mac에서 react 설치하기란

나는 여태 리액트가 그냥 제이쿼리 다운받듯이 스크립트로 연결해서 쉽게 쓸 수 있는 거라고 생각했다. 정말 무식했어.. 일주일 전에 본격적으로 리액트라는걸 맛보기라도 해볼까 싶어서 책도 사고 인터넷에 검색도 해봤는데 1. node.js를 다운받는다. 2.갑자기 npm 어쩌구를 친다. 이 순서로 이어지는게 아니겠는가. node.js 다운받으라고 할때만 해도 진짜 식은죽먹기넴~ㅋ 이정도야 모~~ㅋ 했었는데.. 문제는 2번. 그냥 밑도 끝도 없이 npm 어쩌구라는데 도대체 저걸 어디다 입력하라는건지 뭔지 모르겠고 점차 인내심은 바닥 나기 시작했다. '아.. 이렇게 리액트는 시작도 못해보고 포트폴리오를 마쳐야하는가' 하면서 자기 전에 조금 많이 고민을 하다가 결국 포기하지 않고 열심히 더 구글링을 해보았고 드디어..

REACT 2021.01.10

React 설치시 "babel-loader": "8.1.0" 오류

오늘 처음으로 리액트를 설치해서 실행해보았다. 우선 나는 여러모로 복잡한 상황에 놓여있었는데 컴알못 코딩 잘 못함 맥 사용 총체적 난국.. 그래서 여기저기 사이트 돌아다니며 힌트를 얻어서 설치까지 완료했다. 윈도우랑 다르게 맥은 터미널로 나에겐 생소하고 어려웠던 명령어를 사용해 설치를 해야했기 때문에 거의 복붙으로 해결봤던 것 같다. 바벨이고 얀이고 뭐가 뭔지 하나도 몰라서 이거도 해보고 저거도 해보고 다 했는데 설치가 다 된 후에 yarn start를 치니 연결이 안 되고 오류가 계속해서 뜨는 것이었다. 대략 내용은 바벨 버전이 높아서 안된다는 것 같은 느낌? here might be a problem with the project dependency tree. It is likely not a bug..

REACT 2021.01.09

포트폴리오 만들 때 참고하면 좋을 사이트 정리(이미지편)

내가 살다살다 포트폴리오를 만들어야 하는 날이 올줄은 꿈에도 몰랐다. 대략 6개월 간의 프론트엔드 수업과정이 거의 끝나가고, 학원에서도 당연하게 포트폴리오 제출을 서두르고 있다. 사실 내가 들은 과정은 웹 퍼블리셔? 웹디자이너인데 약간의 코딩을 가미한 정도라 현타가 가끔 오기도 했고 지금도 포트폴리오를 어거지로 만들고 있지만서도 리액트나 추가적으로 공부를 더 해야겠다는 생각이 아주 많이 든다. 와중에 html이나 css 같은 기초 웹 개발에 관심있는 분들을 위해 내가 자주 사용하고 또 자주 도움을 받았던 사이트를 정리하려고 한다. 1. Fontawesome fontawesome.com/icons?d=gallery Font Awesome The world’s most popular and easiest t..

HTML & CSS 2021.01.08

html / css 편집기 뭐가 괜찮을까?(visual studio code, editplus, notepad++)

html과 css를 배운지도 벌써 두 달이 지났다. 그동안 여러가지 편집기를 써봤는데, 사용하기 편했던 편집기 위주로 남겨보려고 한다. ​ ​ 편집기의 장점 1. 태그 자동닫힘 이게 생각보다 매우 편하다. 메모장에서 적다보면 태그 안닫아서 레이아웃 깨지는 경우가 있다거나 속성이 안먹는 경우가 종종 발생한다. 특히 코드가 길어지고 복잡해질수록 닫는걸 가끔 까먹음.. ​ 근데 알아서 자동으로 닫아주니 훨씬 편하다. ​ ​ 2. 태그 색상구분 흰 배경에 검은 글씨만 나열되는 메모장과는 달리, 편집기에서는 태그나 속성마다 색상지정이 가능하다. 사용자의 편의에 따라 원하는 색상으로도 지정이 가능. ​ 특히 css에서는 워낙 많은 선택자가 등장하기 때문에 색상이 구분될수록 훨씬 업무가 수월해진다. ​ ​ 3. 줄 ..

HTML & CSS 2020.12.17

3주간의 뚜레쥬르 교육 후기(실업급여, 훈련장려금 등)

01 4주 차에 관둔다고 하고 그만 두고 나옴. 이유는 많지만 자세히 적긴 좀 그렇고.. 쓰다 보면 썰 중간중간에 이유가 보일 것 같다. 02 우선 뚜레쥬르나 파리바게트 교육이 잡혔는데 실업급여 수급 중이다? -> 상관 없음. 교육비도 지원 받을 수 있고, 실업급여도 수급 가능하다. 한 달에 한 번 나오는 훈련장려금 -> 수급 불가능. 실업급여도 국가에서 주는 것이고 훈련장려금도 국가에서 주는 것이기 때문에 중복 수급이 불가능하다. 둘 중에 하나 선택해서 받아야 함. 03 면접 때는 아무나 들어와서 배우면 다 할 수 있다고 했다. 근데 막상 가서 배우니까 손이 빠른 사람, 느린 사람 다양한데 그것보다도 누군가는 관심을 더 받고 누군가는 덜 받는다는게 문제였다. 이상하게 교육하는 사람 맘에 안들면 와서 제..

베이커리 2020.07.10