728x90

FRONT/Node.js 5

Node.js로 싸이월드 만들기(3+4일차-마무으리)

최종 완성된 동작 과정 뭐.. 사실 쌉허접하고 photo는 하지도 않았지만 어차피 수정/생성/삭제를 node.js 를 사용해서 실행하는 것을 확인하는 것이 목적이었으니 이쯤으로 만족하기로... ^^ 저번 과정에서 내가 고친 점은 1.메뉴를 변화시킬 때마다 메뉴의 색상도 까만색-> 흰색 or 흰색-> 까만색으로 바꾸게 하고 싶었다. 내가 사용한 방법은 그 때 그 때 write(template.html) 그니까 template안에 내가 설정해놓은 css 값을 바꿔서 메뉴 색을 바꾸는 아주 간단한 방법으로 해결이 가능하였다. home, photo, profile 의 메뉴 색깔을 각각 다르게 하기 위해 template 안에 태그 명을 html/ html1/ html2 로 각각 다르게 지정했다. 2.그 외에 no..

FRONT/Node.js 2021.05.09

Node.js로 싸이월드 만들기(2일차-Node.js이용해서 메뉴 클릭에 반응하도록)

사실 원래같으면 오늘 완성시킬 수도 있을텐데 귀찮음이 내 온몸을 지배했기 때문에 다음을 찐막으로 정하고 정말 깔끔하게 끝내겠다... 그래도 원래보다는 조금 그럴듯해진 모습... 근데 사실 별로 한 건 없다. 1.우선 타이틀, home메뉴, 깃헙주소를 눌렀을 때 주소가 이동하는 방식은 굳이 node.js 쓸 필요 없이 a href로 구현이 가능했다. 2.프로필 사진을 바꾼 이유는 내가 원래 내 블로그에다가 올린 사진을 이미지 링크 썼었는데 노드를 쓰면서 갑자기 엑박이 뜨길래 그냥 놀라운 무료 이미지 - Pixabay 여기서 눈에 띄는거 아무거나 이미지 링크 복붙해서 다시 골라서 만들었다. 3.오늘 가장 애를 먹었던건 오른쪽 menu의 배치인데, 어떻게 하면 div와 div를 겹쳐서 만드는지 몰랐었다. 해결..

FRONT/Node.js 2021.05.03

Node.js로 싸이월드 만들기 (1일차-계획짜기+html/css로 디자인)

내가 지금까지 혼자 배운 node.js를 이용해서 한 번 곧 다시 부활할 싸이월드를 만들어 볼 것이다. 허접할 것 같지만.. 그래두 해보는 것이 낫지 않을까해서.. 일단 지금까지 진행상황임 별게 읎다 아직. 1.우선 배경은 CSS Background Patterns by MagicPattern CSS Background Patterns by MagicPattern Beautiful pure CSS background patterns that you can actually use in your projects! www.magicpattern.design 여기에서 최대한 싸이월드 고유의 회색체크무늬 배경 알아서 설정해서 css코드 복붙했다. 2.폰트는 https://cdn.jsdelivr.net/gh/pro..

FRONT/Node.js 2021.05.01

2.html,css,javaScript 다루기 기초(1)

오늘은 본격적인 외관 만들기에 앞서 알아두면 좋을 html,css,javascript들에 대한 정보들을 예제와 함께 다뤄볼 것이다. css html javascript 1.{ } 꼴 2.css의 속성들 3.html과 연결시키기 4.html내에서 css사용하기(태그) 5.가상 요소 ::after 1.태그의 속성 rel,href 2.태그의 속성 name,width,initial-scale 1.var,let,const의 차이 2.화살표함수 3.현재 날짜, 시간 가져오기 4.html과 연결시키기 5.setInterval,setTimeout함수 6.wrap으로 감싸 가져가기 7.document.querySelector() 함수 위는 오늘 살펴볼 html,css,javascript의 이모저모다. 오늘은 위 테이블에..

FRONT/Node.js 2021.02.15

1.github 시작하기

github라는 것이 진짜 첨엔 말만 들어봤지 어떻게 하는지 전혀 몰라서 공짜 강의도 듣고 했었는데.. 이제 진짜 많이는 아니지만 조금은 아는 것도 같다.. 방학동안 작년에 학교 팀끼리 해서 살짝 다뤘던 웹페이지 만들기의 처음~ 끝까지 혼자 완성해보며 내가 원하는 '친구들 추억을 담을 수 있는 웹페이지 만들기' 를 허접하지만 시작해보려고 한다. 1.진짜 맨 처음 깃허브를 시작하는 사람이라면 아래에 들어가서 Git (git-scm.com) 다운로드를 하자. 여기 누르면 됨. 깃허브 계정은 만들었다고 치고, 2-1.폴더 만들기 내가 원하는 이름으로 폴더를 만든다. 2-2.repository 만들기 내가 원하는 이름으로 repository를 만든다. 3.git bash 폴더 내에서 오른쪽마우스를 누르면 git..

FRONT/Node.js 2021.02.09
728x90