나아가는 길에 발자국을 찍어보자

부제 : 결국 모바일 버전도 만들어야하는상황 2차 미팅의 요구사항까지 반영하고 나서 코딩 친구의 불다를 부랴부랴 막고 나니 코딩친구는 부지런하게도 또다른 훼방을 가져왔다. 핸드폰으로 들어가서 보거나 브라우저 창크기를 줄여보며 이거 비율이 이상해라고 말했다. 원래는 오프라인 전시를 생각하여 미대생 전시회장 실에 노트북을 틀어서 전시실에서 직접처보는 즉 전체화면만 고려하면 되었지만, 코로나 덕분에 온라인 전시로 변경되었다. 그러다 보니 전시회 구경하는 사람들이 핸드폰이나 컴퓨터등 다양한 기기를 통해 페이지에 유입이 되었고, 모바일 비율은 신경쓰지 않던 우리 페이지는 비율이 다 깨지는 채로 보여졌고 마우스 움직임을 감지하는 기능은 터치의 기능을 잘 인식하지못했다. 또한 내가 사용한 제이쿼리 ui는 모바일 환경..

앞서 미대생이 요구했던 큰기능 들은 모두 완성되어 간단하게 aws에 s3 정적 호스팅으로 배포를 진행했다. 다른 사용자의 피드백도 받아야하니까,,, 물론 미대생은 정적호스팅으로 만든 도멘인 이름을 매우 맘에 들어하지 않았기에 라우트53을 이용해 새로 도메인에 연결해야했지만.. 그건 나중에 정리해야겠다. (뭐가,,,,이렇게 정리할게 엄청 많지,,?) 여튼 저튼 우선 배포를 진행하였고 코딩친구한테 사용해보라고 시켰다. 그런데 폰트를 다운받아 버리더라..... 배포된 페이지에서 개발자모드를 키더니 폰트파일인 ttf파일을 다운로드해서 '이거 이렇게 다운 받을 수 있어도돼? ' 하고 물어보는데..... 미대생은 안된다고 그러면안된다고오오오오 해서 원래 웹 폰트를 가져올 땐 다운을 받아야해서 어쩔 수 없다는걸 나는..

기능을 하나씩 만들고 있던 중... 미대생이 배경색과 폰트색을 바꾸고 싶다는 이야기를 했다. 추가로 새로고침이 될 때마다 색이 바뀌었으면 좋겠다고 한다. 처음에 간단한 기능인줄알았다. 실제로도 간단하다. 다만 나는 #의 중요성을 몰랐다...... RGB값으로 배경색과 폰트색을 정한 객체배열을 선언해서 화면이 렌더링 될때마다 랜덤값으로 인덱스를 생성해 보여주면 새로고침될때마다 색이 랜덤으로 바뀌게 하면 된다고 생각했다. 실제로 저렇게 동작한다. body부분 배경색과 폰트컬러에는 #을 붙이지 않아도 컬러가 적용이 되길래 textarea에도 같은 방식으로 컬러값을 주었는데 적용이 안되더라......이걸로 이틀을 골머리를 앓았다. 제이쿼리로 접근도해보고 자바스크립트로 접근도해보고 직접 값을 줘보고 아무리해도 의..

이 두개의 기능을 만들 때, 조금 머리아팠던 기능이 가운데 정렬 기능이었다. 에 height를 지정을 해버리면 박스의 맨왼쪽 윗쪽부터 글씨가 쓰여져버리고 입력되어지는 글자들의 높이가 에서 지정한 height를 넘어가게되면 슬라이드바가 생긴다.... 따라서 전체 입력된 글자들을 좌우 중앙정렬은 어렵지 않았으나, 상하 중앙 정렬이 발목을 잡았었다. 찾아보니까 라이브러리가 있긴있었다. 다만 내가 원하던 기능과 조금은 거리가 있어서 조금 더 찾아보다가 그냥 구현하기로 하였다. 중앙 정렬에 이어 미대생이 원했던 기능은 글자가 중앙 정렬이 되면서 글자수가 많아지면 글자의 크기가 줄어드는 것을 원했다. 이것도 예시 페이지를 보여줬는데, 못찾았다ㅜㅜ. 구현한 2개의 기능을 정리해 보고자 한다. 1. 정렬 1) 기능 t..