<HtmlStudy /> 웹페이지 - 제작 상황(2)

오랜만에 홈페이지 작업을 진행해 남겨놓기로 했다.

1. 홈페이지 상황

저번 작업량

이번 작업

• 목록 태그
• 피규어 태그
• 표 만들기
• 폼 요소
• 로고 추가

2. 문제점

 Material UI를 임포트해 사용하다 보니 문제점이 발생했다.

1. 태그를 눌러 이동하면 왼쪽의 내비게이션 탭이 닫히게 된다.
2. 다른 태그들을 보고 싶다면 또 왼쪽의 화살표 모양을 다시 눌러 이동해야 한다.
3. 내가 만들고 사용해도 불편했다. 그래서 이전글 다음글 버튼을 만들기로 했다.

3. 해결책

import { NavLink } from "react-router-dom";
...

const prevPage = { path: "/devtools/vscode" };
const nextPage = { path: "/html/paragraph" };

....

    <div className={styles.navigationButtons}>
          {prevPage && (
            <NavLink to={prevPage.path} className={styles.navigationLink}>
              ⬅ 이전글
            </NavLink>
          )}
          {nextPage && (
            <NavLink to={nextPage.path} className={styles.navigationLink}>
              ⮕ 다음글
            </NavLink>
          )}
        </div>

글이 길어지면 아래로도 바로 이동이 가능하게 버튼을 위아래로 만들었다.

4. 방향성

1. Material UI 가 열려있게 만들 수가 있는지 해결책을 찾아봐야겠다고 생각했다.

2. HTML를 빨리 완성시켜야겠다. 사실 중요한 부분이 아니다

3. css 방향성 다 알려줄 것인지 꿀팁들만 알려줄 것인지. 꿀팁 방향성 유력

4. 뭔가 헤더랑 로고가 디자인이 매칭이안됌 바꿔야 할 듯함

홈페이지는 임시 배포로 디자인에 대해 뭔가 일가견이 있으신 분은 댓글로 조언을 주신다면 감사하겠습니다.

웹디자인에 관심 있으신분은 bp4sp4@naver.com 연락주시면 언제나 환영입니다~

https://bp4sp4.github.io/HtmlStudy/