티스토리

rexondex's blog
검색하기

블로그 홈

rexondex's blog

rexondex.tistory.com/m

방문해주셔서 감사합니다! 깃허브: https://github.com/rakaso598

구독자
0
방명록 방문하기
공지 [소개] 안녕하세요, rexondex⋯ 모두보기

주요 글 목록

  • GitHub 타임라인형 게시판 배포 [후기] rakaso598.github.io Timeline rakaso598.github.io 깃허브에는 `유저명.github.io` 리포지토리를 통해 정적 웹페이지를 배포하는 기능이 있습니다. 이번에 유저명 저장소를 업데이트 한 겸, 후기를 작성합니다.  HTML로 전체적인 구조를 정의하고 `/` 루트 위치에 배치했습니다.`/images` 에는 이미지가 들어가도록,그리고 `/items`에는 게시물을 담당하는 데이터를 넣었습니다. `/items/items.json` 파일은 게시물의 데이터를 표현합니다.  이렇게요! JSON은 문자열 데이터 포맷으로, 문자열을 구조화하여 저장합니다.가장 큰 틀을 대괄호로 감싸고 중괄호로 게시물을 구분하게 했습니다. 중괄호 `{}`안에는 키와 값으로 구분되도록 데이터를 정리하면 됩.. 공감수 0 댓글수 0 2025. 1. 26.
  • 하루 수익으로 1년 복리 계산하는 웹페이지 https://rakaso598.github.io/daily-returns 하루 수익으로 1년 복리 계산하기 rakaso598.github.io  하루 수익률로 1년 복리 계산하는 웹페이지입니다.  원금을 입력합니다.하루 수익을 입력합니다.계산 버튼을 누릅니다.계산 결과가 표시됩니다.이전 결과는 로그로 표시됩니다.초기화 버튼으로 초기화 가능.  어떤 사용자들이 필요로 하나요? 이 웹페이지는 `1일 수익을 바탕으로 365일 복리 계산을 통해, 1년 이자율을 계산하는 도구` 입니다. 1일 수익을 365일동안 복리로 누적해서 받을 때, 연간 이자율은 몇 퍼센트가 될까? 라는 궁금증에 도움을 주기 위해 만들어졌습니다. *해당 계산기는 계산식에 오류가 있을 수 있으므로 참고로만 확인하세요* 공감수 1 댓글수 0 2025. 1. 19.
  • Excel 파일을 제작하고 다운로드하는 웹페이지 만들기 [GitHub Pages] https://rakaso598.github.io/xlsx-generator/  자바스크립트 탐색 중 CSV라는 데이터 포맷에 대해 알게 되었고, 이를 활용하여 파일을 제작하고 다운로드하는 기능을 만들 수 있을 것이라는 아이디어를 떠올렸습니다. CSV 포맷은 데이터를 콤마(,)로 구분하는 간단하고 직관적인 방식으로, 이를 자바스크립트에서 처리하는 것은 비교적 용이한 작업이라고 예상했습니다. 자바스크립트는 이미 JSON 파싱 및 직렬화 기능을 갖추고 있어, 문자열을 다루는 함수 구현에 있어 충분한 기반을 제공하고 있었기 때문입니다. 이러한 배경을 바탕으로, 사용자로부터 입력 받은 데이터를 CSV 파일로 변환하는 프로토타입을 제작한 뒤, 이를 발전시켜 브라우저에서 다운로드할 수 있는 .xlsx 엑셀 파일로 .. 공감수 1 댓글수 1 2024. 12. 27.
  • 온디맨드 CSS 애니메이션으로 웹페이지 꾸미기 [CSS/JS] https://animista.net/play/text/tracking-in/tracking-in-expand Animista - On-Demand CSS Animations LibraryAnimista is a CSS animation library and a place where you can play with a collection of ready-made CSS animations and download only those you will use.animista.net ↑ ↑ ↑Animista 에서는 미리 정의된 CSS 애니메이션을 쉽고 빠르게 사용할 수 있도록 도와줍니다.FreeBSD 라이선스를 가지고 있으므로 자유롭게 사용할 수 있지만, 원 저작자의 저작권을 꼭 명시하여야 합니다.   CSS/.. 공감수 1 댓글수 1 2024. 10. 28.
  • 총알 피하기 게임 만들고 플레이 및 배포해보자 [GitHub Pages] https://rakaso598.github.io/dodge-the-bullets/[ 여기서 플레이 해보세요! ]  총알 피하기 게임리셋 방향키로 이동하여 총알을 피하세요! 점수: 0 ◀ ▼ ▶rakaso598.github.io    자바스크립트의 오픈소스 라이브러리인 Phaser.js를 활용했습니다. 2D 이미지를 활용한 간단한 게임을 만들때 편리하고 유용한 것 같습니다. Phaser.js에서는 간편하게 설정할 수 있는 중력과 백그라운드 화면 개념, 그리고 스프라이트 이미지도 사용할 수 있습니다. 백그라운드 화면 기능은 Phaser.js에는 특정 함수가 작동할때 미리 정의된 맵으로 현재 맵을 덮는 기능입니다. 예를 들면, 캐릭터가 이동하여 포탈에 닿으면 미리 정의된 맵이 넘어오는(현재 맵을 덮어쓰는) .. 공감수 2 댓글수 1 2024. 10. 24.
  • 카드 맞추기 게임 만들고 배포, 플레이까지 해보자 [GitHub Pages] https://rakaso598.github.io/memory-match-game/[ 여기서 게임을 플레이해 보세요!/PC 모바일 모두 지원 ] Memory Match Game축하합니다! 모든 카드를 맞췄습니다. 게임 시간: 초 다시 시작rakaso598.github.io   게임 룰: 게임 시작 버튼을 누르면 2초간 전체 카드를 보여줍니다.같은 알파벳이 적힌 카드를 순서대로 클릭하면 뒤집어놓을 수 있습니다.모든 카드를 뒤집으면 게임 승리입니다. 클리어하는데 걸린 시간을 확인할 수 있습니다. 리셋 버튼을 누르면 초기 설정으로 돌아갑니다. 다시 게임 시작 버튼을 눌러 새로 게임을 시작합니다.   깃허브 리포지토리를 GitHub Pages 기능을 이용하여,깃허브 도메인을 가진 정적 웹페이지로 빠르게 배포할 .. 공감수 2 댓글수 1 2024. 10. 22.
  • 깃허브 페이지에 두더지게임을 배포해보자 [PC/Mobile] https://rakaso598.github.io/whack-a-mole/[여기서 플레이해보세요!] 두더지 게임 rakaso598.github.io   PC와 모바일 모두 지원하는 두더지게임을 깃허브 페이지를 통해 배포해보았습니다. 게임 방법은 갈색 점이 생긴 원을 클릭하면 점수가 오릅니다. 모바일에서 스크롤이 되지 않게 전체 화면 크기를 제한하고body { overflow: hidden; } 을 적용해 화면을 벗어나는 요소는 화면에서 가려 스크롤이 되지 않게 했습니다. https://github.com/rakaso598/whack-a-mole GitHub - rakaso598/whack-a-mole: whack-a-mole game on GitHub pageswhack-a-mole game on Git.. 공감수 5 댓글수 2 2024. 10. 21.
  • 깃허브 페이지로 데이터 시각화 도구를 배포해보자 [후기] https://rakaso598.github.io/input-data-visualizer/ Data VisualizationEnglish 한글 User Data Visualization This tool allows you to visualize data by entering comma-separated values. You can choose to display the data as a bar chart, line chart, pie chart, radar chart, doughnut chart, or scatter chart. You can reset the inprakaso598.github.io 이 정적 웹페이지는 언어 토글 기능을 제공합니다 [ English / 한글 ]사용자는 입력칸에 숫자를 .. 공감수 3 댓글수 1 2024. 10. 17.
  • GitHub Pages로 정적 웹페이지 배포하기 [후기] GitHub Pages는 어떤 기능인가요? GitHub Pages는 GitHub 리포지토리의 내용을 웹사이트 형태로 호스팅할 수 있는 기능으로, HTML, CSS, JavaScript 파일을 웹에서 쉽게 게시하고 공유할 수 있습니다.  깃헙 리포지토리의 내용을 간단하게 웹사이트 형태로 호스팅할 수 있는 기능입니다. [리포지토리에 HTML 커밋] -> [리포지토리 Settings > Pages > 소스 및 브랜치 선택] 이렇게 업로드하는 것만으로 바로 깃허브 도메인을 가진 정적 HTML을 배포 가능합니다. 만약 리포지토리명을 "static-utility" 로 정했다면상단에 이렇게 표시됩니다.  이 페이지에 접근하려면  https://rakaso598.github.io/static-utility/( 사용자명.. 공감수 2 댓글수 2 2024. 10. 17.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.