[Portfolio] 모바일 대응

2025. 1. 21. 14:00Etc Project/Portfolio

https://github.com/KwonGeneral/Kortfolio.git

 

GitHub - KwonGeneral/Kortfolio: 포트폴리오

포트폴리오. Contribute to KwonGeneral/Kortfolio development by creating an account on GitHub.

github.com

 

프로젝트 부분은 모바일을 생각해서 디자인을 개발했기 때문에, 영향은 없지만, 프로필 부분은 수정해야할 부분이 있습니다. 모바일로 접근하면 기존에 가로로 표시하던 내용을 세로로 표시할 필요가 있어 보입니다.

 

먼저, views를 모바일 환경에서 접근한 경우에 리다이렉트해주도록 수정하겠습니다.

 

정상 동작하는지 확인해보겠습니다.

 

잘 동작하네요. 모바일 대응은 여러 방법이 있지만, 저는 심플하게 html만 뜯어서 사용하겠습니다.

기존의 home.html인데, m_home.html을 만들고 profile 부분만 수정할 것이기 때문에 m_profile.html도 새로 만들어서 적용하겠습니다.

 

 

기존의 class명을 그대로 사용할 경우, css가 중첩 적용될 수 있으니, 앞에 m을 붙여서 구분하겠습니다~

그리고 가로로 긴 문구들을 정리하고 프로그래스바 비율도 조금 수정해주고~ 조금씩만 손보면 완성입니다.


 

 

이렇게하면 포트폴리오 페이지는 완성입니다~!

이제 AWS EC2로 배포하면 끝입니다.

다음 포스트 부터는 웹페이지를 배포하는 과정을 다루겠습니다.

도메인도 하나 구매해야겠네요~