대충 이런 느낌의 심플하면서도 예쁜 쇼핑몰을 만드는 것이 목표이다 가장 처음에 해주어야할 것이 background image를 크게 삽입해주는 것 image라는 div안에 배경이미지를 삽입해줄 것이다 .image{ height:750px; background-repeat:no-repeat; background-image:url(img/kids101.jpg); background-size:cover; } background-size:cover특성은 값을 cover 로 지정하면 배경이미지의 가로, 세로 길이 모두 요소보다 크다는 조건하에 가능한 배경 이미지를 작게 조정합니다. 가로, 세로 비율은 유지됩니다. 따라서 배경 이미지의 크기는 요소의 크기보다 항상 크거나 같습니다. 아래 예제의 크기를 조절해서 실제..
삭제를 어떻게 구현할까고민하다 플레이리스트마다 할당된 id를 delete버튼마다 주어서 delete 버튼을 누르면 으로 id를 submit해주어서 해당 플레이리스트 id를 가진 것을 삭제한다 마찬가지로 곡도 곡마다 delete버튼을할당하고 songid를 delete버튼에 부여하고 버튼이 눌리면 id를 submit해서 삭제해준다 그리고 곡의 개수도 하나 지워준다 이제 다음 단계로는 곡 제목, 가수, 기록, 플레이리스트 이름 수정 update를 구현하면 delete랑 update버튼을 묶어서 hide해놓거나 생활코딩에서 말해준 검색, 정렬기능을 구현해볼까 한다
아직은 플레이리스트 추가밖에 못한다 곡 추가기능은 조만간 구현할 예정이다 생활코딩 nodejs, nodejs-mysql강의를 다 듣고 생활코딩의 코드를 수정하는 방법으로 내가 원하는 홈페이지를 만들어가고 있다 한 가지 문제점은 플레이리스트라는 테이블안에 song이라는 테이블을 넣고싶었는데 mysql에는 테이블 안에 테이블을 넣을 수 있는 방법이 없다고 한다 그래서 calm이라는 플레이리스트를 생성하면 calm_song이라는 테이블을 동적으로 생성해 거기에다 곡을 저장할까 생각해봤는데, 그러면 플레이리스트 하나당 테이블이 하나씩 동적으로 계속 생기기때문에 그냥 playlist, song이라는 테이블을 만들고 playlist에 플레이리스트 이름, song에 제목,가수,기록을 한 다음 song에 playlis..
nodejs를 통해 사용자로부터 입력받은 플레이리스트, 곡에대한 정보를 받아와 내 로컬 환경에 동적으로 파일을 생성하는데 성공했다 nodejs는 javascript의 기본 문법을 따르지만 실제 코드를 보면 낯선 코드들이 많았다 var http = require('http'); var fs = require('fs'); var url = require('url'); var qs=require('querystring'); require이라는 문법으로 http,fs(filesystem),url,querystring을 받아온다 function templateHTML_Song(title,list,body){ return ` WEB ${body} `; } 그리고 기존에는 플레이리스트의 개수만큼 html을 생성해주어..
한계에 봉착했다 1. 곡 영구 저장 x - 사용자로부터 정보를 입력받고 html파일에 동적으로 추가할 수는 있지만 새로고침하면 데이터가 사라진다 2. 플레이리스트 추가 x -플레이리스트 장르마다 html링크가 하나씩 걸려있는데, 이 html파일은 내가 미리 만들어둔 파일이다 즉, 사용자로부터 장르 추가를 받아 새로운 목록을 추가하면 html파일도 동적으로 생성이 되어야 하는데 자바스크립트만으로는 불가능하다 그래서 찾아본 결과 1번을 해결하기위해서는 데이터베이스, 2번을 해결하기위해서는 서버의 힘이 필요하다고한다 1번은 대표적으로 oracle, mysql(mariadb)가 있고, 2번은 대표적으로 node.js, jsp, php가 있다 1번은 무료인 mysql을 선택할 것이고 2번은 jsp는 대규모, 난이..
곡,제목,기록 추가기능을 하나의 버튼안에 넣고, 버튼을 누르면 새 윈도우창이 뜨는 형식으로 고쳤다 그런데 문제가 있다 'Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame' 이러한 오류가 뜬다 이는 크롬에서 웹을 로컬 파일로 실행하면 보안상의 이유로 브라우저자체에서 iframe 과 통신을 막아 동작하지 않는다고한다 즉 서버로 실행하면 잘 동작하지만 테스트환경에서는 안된다는 것 해결 방법이 두 가지가 있다 하나는 서버로 실행하는 것 두번째는 크롬의 대상에 --disable-web-security --user-data-dir="C:\chrome"를 추가하는 것 둘다해보았다 첫번쨰는 아파치 서버..
사실 두번째 걸음이다 색상변경기능이 사용자가 버튼을 입력하면 그에 따라 변화하는 거니까 그런데 첫걸음이라고 쓴 이유는 단순한 버튼 클릭을 넘어 사용자로부터 텍스트를 입력받아 웹사이트에 적용하는게 내가 원하던 기능이기 때문이다 아직 고쳐야할 부분이 많다 제출 버튼을 누르면 사용자가 썼던 내용이 없어지게 구현하고 싶고 이거 새로고침하면 다 날라가서 아마 데이터베이스에 저장해야될것이고 저렇게 웹사이트에 보기 흉하게 있기보다는 곡 추가 버튼을 만들어서 거기에 다 입력할 수 있게 하고 싶다 윈도우 오픈으로해야하나 고민중이다
- Total
- Today
- Yesterday
- 오픈소스
- 로스트아크 캐릭터
- javascript
- 인프콘2024
- DML
- DDL
- 데이터3법
- 데이터베이스
- SpringBoot
- git 예전 커밋 수정
- git
- SQL
- authorization_code
- html #웹 #웹사이트 #플레이리스트
- infcon 2024
- authorization code
- 2024인프콘
- 데이터 3법
- kloa
- 리눅스
- oauth
- oauth2.0
- 클로아
- Android Studio
- 프로그래머스
- bfs
- CSS
- git commit 수정
- html
- 우분투
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |