dgd03146 / blog Goto Github PK

Description

Compose Header layout and css

To-do

• Compose Header Layout
• Apply CSS
• Responsive design

Screenshot

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

Husky & Prettier & EsLint Set Up

To-do

• Prettier, Husky, and ESLint setting:
• Configure Prettier for code formatting
• Set up Husky for pre-commit and pre-push hooks
• Configure ESLint for code listing

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

A clear and concise description of what the problem is.
Twin Macro & Styled-Components set up

To-do

A clear and concise description of what you have to do.

• Install Styled-Components and set up
• Install Twin Macro and set up

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Describe the bug

A clear and concise description of what the bug is.

To Reproduce

Steps to reproduce the behaviour:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See the error

Expected behaviour

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

Additional context
Add any other context about the problem here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Is your feature request related to a problem? Please describe.**

Make layout for home page and CSS design.

Describe the solution you'd like**

A clear and concise description of what you want to happen.

Describe alternatives you've considered**

I consider image animation and looking for a colour which great.

Additional context

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

A clear and concise description of what the problem is.
Styled Components & Twin.macro Global Style set up

To-do

A clear and concise description of what you have to do.

• Font set-up
• Display set up
• Style reset

Screenshot

'use client'

// import React from 'react'
import { createGlobalStyle } from 'styled-components'
import tw from 'twin.macro'

const GlobalStyles = createGlobalStyle`
  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  html{
    scroll-behavior: smooth;
  }

  body,button,input,textarea{
    ${tw`text-normal`}
  }

  h1, h2, h3{
    ${tw`font-bold`}
  }

  ul{
    list-style: none;
  }
 
  a{
    text-decoration: none;
  }
 
  button{
    cursor: pointer;
    border: none;
    outline: none;
    display: inline-block;
    padding: 1.2rem 2rem;
    border-radius: 1rem;
    font-weight:  ${tw`font-medium`}
  }

  button:hover{
    background-color: black;
  }

  img{
    max-width: 100%;
    height: auto;
  }
 
`

export default GlobalStyles

• Edit main page design
• Edit layout

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Description

A clear and concise description of what the problem is.

To-do

A clear and concise description of what you have to do.

Additional context

Add any other context or screenshots about the feature request here.

Describe alternatives you've considered

A clear and concise description of any alternative solutions or features you've considered.

• Add server action logic to store theme in the cookie
• Get theme from cookie and block with useTransition