WEB5 javascript로 자판기 프로그램 만들기 하욤 오랜만입니다. 저는 취업해서 자바스크립트를 다루는 업무를 맡게 되어 열심히 공부중인데요,, 아직 신입인지라 공부시간을 많~이 주셔서 (이거 지금은 아님. 지금은 바쁨...............) 회사에서 js 실습을 풀었습니다. ^^ 새 언어 익히는 덴 실습이 최고. 이 게시물은 실습을 하며 짠 코드를 정리하기 위함임니더 실습 문제는 아래 링크에서 제시된 예제인데, 음료수 자판기 기능을 구현하는 것이다. https://kim-coffee.tistory.com/20 [실습예제] 자바스크립트(JavaScript)로 자판기(vending machine) 만들기 2019/10/08 - [JavaScript/초보자를 위한 자바스크립트] - 초보자를 위한 자바스크립트 커리큘럼 2019/10/02 - [Java.. 2023. 3. 14. [django] 이미지 파일 업로드 기능 추가 장고로 게시판을 만들다 보면 이미지를 업로드해야 할 필요성이 생긴다. 게시판이 아니더라도 웹사이트의 대부분에서 이미지 파일이 여러 용도로 쓰이기 때문에 장고로 파일 업로드 하는 걸 알아 두면 좋을 것이다. 이미지 파일 업로드 기능을 구현하기 전 제품 목록 화면과 제품 코드를 클릭했을 때 나오는 제품 상세 화면이다. 여기서 이미지 파일 업로드 기능을 구현하고, 제품 목록 화면의 테이블에 '이미지 유무' 컬럼을 추가하고 제품 상세 화면에 이미지를 띄워보자. 1. config/settings.py from pathlib import Path import os MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'media') config 디렉터리의 setti.. 2022. 11. 9. [django] 장고 form select option 값 뷰 함수에서 GET으로 받기 결과 미리보기 키오스크 판매관리 웹시스템을 만들 때, 키오스크 조회 메뉴에서 select option을 선택하는대로 조회 화면이 바뀌는 걸 구현하고 싶었다. 아래는 기능이 구현된 움짤이다. 이렇게 구매처 분류 컬럼이 공공인 경우와 민간인 경우, 판매한 지 1년이 지나 무상a/s가 불가한 키오스크 정보를 선택하여 가져오는 기능이다. 이 기능은 html의 select option 태그를 이용해서 구현했다. HTML 삽입 미리보기할 수 없는 소스 MTV 패턴 흐름 정리 장고의 MTV 패턴의 흐름을 정확히 알아야 자신의 웹사이트를 커스터마이징할 때 유용한 것 같다. 그래서 우선 select option 값을 뷰 함수에 넘기고, 모델에서 데이터를 받아와서 템플릿에 뿌리는 과정을 MTV 패턴 그림을 이용해 표현하자.. 2022. 11. 1. [html/css]웹 페이지 만들 때 유용한 기능 모음 * 마우스 드래그 색상 변경 /* css */ ::selection{ color : gold; background-color : #FFBF00; /* 변경하려는 컬러 코드*/ text-decoration : underline;} --->> ::selection은 웹 페이지에서 마우스 커서로 텍스트 요소를 클릭하거나 드래그할 때 강조되는 스타일을 지정 * 메뉴 내비게이션 바 Home Blog About Contact 번호 없는 리스트를 나타내는 태그를 인라인 태그로 바꾸면 아래로 정렬되던 리스트가 가로로 정렬된다. 가로로 정렬된 리스트의 마커를 없애고, 마우스를 리스트 텍스트 위에 올렸을 때 밑줄이 그어지도록 스타일을 지정한다. 내비게이션 바의 각 메뉴들 사이 간격은 letter-spacing 속성을 통해.. 2022. 6. 23. 이전 1 2 다음
