diff --git a/src/components/App/App.css b/src/components/App/index.css
similarity index 100%
rename from src/components/App/App.css
rename to src/components/App/index.css
diff --git a/src/components/App/App.tsx b/src/components/App/index.tsx
similarity index 60%
rename from src/components/App/App.tsx
rename to src/components/App/index.tsx
index b2f67034..91789fee 100644
--- a/src/components/App/App.tsx
+++ b/src/components/App/index.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
-import './App.css'
+import './index.css'
 
-import Header from '~components/Header/Header'
-import Main from '~components/Main/Main'
+import Header from '~components/Header'
+import Main from '~components/Main'
 
 function App() {
     return (   
diff --git a/src/components/Button/Button.css b/src/components/Button/index.css
similarity index 100%
rename from src/components/Button/Button.css
rename to src/components/Button/index.css
diff --git a/src/components/Button/Button.tsx b/src/components/Button/index.tsx
similarity index 98%
rename from src/components/Button/Button.tsx
rename to src/components/Button/index.tsx
index 97f0edd0..4f3c1ad6 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/index.tsx
@@ -1,10 +1,11 @@
 import React from 'react'
-import './Button.css'
+import classNames from 'classnames'
+
+import './index.css'
 
 import New from '../../../assets/new'
 import Menu from '../../../assets/menu'
 import Link from '../../../assets/link'
-import classNames from 'classnames'
 
 interface Props {
     color: string
diff --git a/src/components/Fieldset/Fieldset.css b/src/components/Fieldset/index.css
similarity index 100%
rename from src/components/Fieldset/Fieldset.css
rename to src/components/Fieldset/index.css
diff --git a/src/components/Fieldset/Fieldset.tsx b/src/components/Fieldset/index.tsx
similarity index 97%
rename from src/components/Fieldset/Fieldset.tsx
rename to src/components/Fieldset/index.tsx
index c1849c28..799d7c19 100644
--- a/src/components/Fieldset/Fieldset.tsx
+++ b/src/components/Fieldset/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import './Fieldset.css'
+import './index.css'
 
 interface Props {
     fieldName: string
diff --git a/src/components/Header/Header.css b/src/components/Header/index.css
similarity index 100%
rename from src/components/Header/Header.css
rename to src/components/Header/index.css
diff --git a/src/components/Header/Header.tsx b/src/components/Header/index.tsx
similarity index 94%
rename from src/components/Header/Header.tsx
rename to src/components/Header/index.tsx
index 40ef3990..72892f90 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/index.tsx
@@ -2,10 +2,10 @@ import React, { useEffect, useState } from 'react'
 import { RouteComponentProps, useLocation, withRouter } from 'react-router-dom'
 import { useCookies } from 'react-cookie'
 
-import Button from '~components/Button/Button'
-import HeaderMenu from '~components/HeaderMenu/HeaderMenu'
+import Button from '~components/Button'
+import HeaderMenu from '~components/HeaderMenu'
 
-import './Header.css'
+import './index.css'
 
 interface Props {}
 interface HeaderProps extends RouteComponentProps<Props> {}
diff --git a/src/components/HeaderMenu/HeaderMenu.css b/src/components/HeaderMenu/index.css
similarity index 100%
rename from src/components/HeaderMenu/HeaderMenu.css
rename to src/components/HeaderMenu/index.css
diff --git a/src/components/HeaderMenu/HeaderMenu.tsx b/src/components/HeaderMenu/index.tsx
similarity index 94%
rename from src/components/HeaderMenu/HeaderMenu.tsx
rename to src/components/HeaderMenu/index.tsx
index 821c9d34..a8e2f6ba 100644
--- a/src/components/HeaderMenu/HeaderMenu.tsx
+++ b/src/components/HeaderMenu/index.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
-import './HeaderMenu.css'
+import './index.css'
 
-import LoginModal from '~components/LoginModal/LoginModal'
-import SignupModal from '~components/SignupModal/SignupModal'
+import LoginModal from '~components/LoginModal'
+import SignupModal from '~components/SignupModal'
 
 import { useModal as useSignupModal } from '~utils/useModal'
 import { useModal as useLoginModal } from '~utils/useModal'
diff --git a/src/components/LoginModal/LoginForm.css b/src/components/LoginModal/index.css
similarity index 100%
rename from src/components/LoginModal/LoginForm.css
rename to src/components/LoginModal/index.css
diff --git a/src/components/LoginModal/LoginModal.tsx b/src/components/LoginModal/index.tsx
similarity index 94%
rename from src/components/LoginModal/LoginModal.tsx
rename to src/components/LoginModal/index.tsx
index abc1fbf0..2d39b4d1 100644
--- a/src/components/LoginModal/LoginModal.tsx
+++ b/src/components/LoginModal/index.tsx
@@ -3,12 +3,12 @@ import { withCookies, Cookies } from 'react-cookie'
 import { createPortal } from 'react-dom'
 import api from '~utils/api'
 
-import Button from '~components/Button/Button'
-import Fieldset from '~components/Fieldset/Fieldset'
-import Modal from '~components/Modal/Modal'
-import Overlay from '~components/Overlay/Overlay'
+import Button from '~components/Button'
+import Fieldset from '~components/Fieldset'
+import Modal from '~components/Modal'
+import Overlay from '~components/Overlay'
 
-import './LoginForm.css'
+import './index.css'
 
 import New from '../../../assets/new'
 
diff --git a/src/components/Main/Main.tsx b/src/components/Main/index.tsx
similarity index 100%
rename from src/components/Main/Main.tsx
rename to src/components/Main/index.tsx
diff --git a/src/components/Modal/Modal.css b/src/components/Modal/index.css
similarity index 100%
rename from src/components/Modal/Modal.css
rename to src/components/Modal/index.css
diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/index.tsx
similarity index 95%
rename from src/components/Modal/Modal.tsx
rename to src/components/Modal/index.tsx
index 4879b5ba..4e95ccc4 100644
--- a/src/components/Modal/Modal.tsx
+++ b/src/components/Modal/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import classnames from 'classnames'
 
-import './Modal.css'
+import './index.css'
 
 interface Props {
     styleName?: string
diff --git a/src/components/Overlay/Overlay.css b/src/components/Overlay/index.css
similarity index 100%
rename from src/components/Overlay/Overlay.css
rename to src/components/Overlay/index.css
diff --git a/src/components/Overlay/Overlay.tsx b/src/components/Overlay/index.tsx
similarity index 89%
rename from src/components/Overlay/Overlay.tsx
rename to src/components/Overlay/index.tsx
index 8195e3ca..4ca6ba4e 100644
--- a/src/components/Overlay/Overlay.tsx
+++ b/src/components/Overlay/index.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
-import './Overlay.css'
+
+import './index.css'
 
 interface Props {
     onClick: OnClickEvent
diff --git a/src/components/SearchModal/SearchModal.css b/src/components/SearchModal/index.css
similarity index 100%
rename from src/components/SearchModal/SearchModal.css
rename to src/components/SearchModal/index.css
diff --git a/src/components/SearchModal/SearchModal.tsx b/src/components/SearchModal/index.tsx
similarity index 95%
rename from src/components/SearchModal/SearchModal.tsx
rename to src/components/SearchModal/index.tsx
index 7a32681e..0c53dfc9 100644
--- a/src/components/SearchModal/SearchModal.tsx
+++ b/src/components/SearchModal/index.tsx
@@ -2,11 +2,11 @@ import React from 'react'
 import { createPortal } from 'react-dom'
 import api from '~utils/api'
 
-import Modal from '~components/Modal/Modal'
-import Overlay from '~components/Overlay/Overlay'
-import WeaponResult from '~components/WeaponResult/WeaponResult'
+import Modal from '~components/Modal'
+import Overlay from '~components/Overlay'
+import WeaponResult from '~components/WeaponResult'
 
-import './SearchModal.css'
+import './index.css'
 
 interface Props {
     close: () => void
diff --git a/src/components/SignupModal/SignupModal.css b/src/components/SignupModal/index.css
similarity index 100%
rename from src/components/SignupModal/SignupModal.css
rename to src/components/SignupModal/index.css
diff --git a/src/components/SignupModal/SignupModal.tsx b/src/components/SignupModal/index.tsx
similarity index 97%
rename from src/components/SignupModal/SignupModal.tsx
rename to src/components/SignupModal/index.tsx
index 7704365f..99cd58ce 100644
--- a/src/components/SignupModal/SignupModal.tsx
+++ b/src/components/SignupModal/index.tsx
@@ -3,12 +3,12 @@ import { withCookies, Cookies } from 'react-cookie'
 import { createPortal } from 'react-dom'
 import api from '~utils/api'
 
-import Button from '~components/Button/Button'
-import Fieldset from '~components/Fieldset/Fieldset'
-import Modal from '~components/Modal/Modal'
-import Overlay from '~components/Overlay/Overlay'
+import Button from '~components/Button'
+import Fieldset from '~components/Fieldset'
+import Modal from '~components/Modal'
+import Overlay from '~components/Overlay'
 
-import './SignupModal.css'
+import './index.css'
 
 import New from '../../../assets/new'
 
diff --git a/src/components/UncapIndicator/UncapIndicator.css b/src/components/UncapIndicator/index.css
similarity index 100%
rename from src/components/UncapIndicator/UncapIndicator.css
rename to src/components/UncapIndicator/index.css
diff --git a/src/components/UncapIndicator/UncapIndicator.tsx b/src/components/UncapIndicator/index.tsx
similarity index 90%
rename from src/components/UncapIndicator/UncapIndicator.tsx
rename to src/components/UncapIndicator/index.tsx
index b5a9f5ce..e64486f0 100644
--- a/src/components/UncapIndicator/UncapIndicator.tsx
+++ b/src/components/UncapIndicator/index.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 import classnames from 'classnames'
-import UncapStar from '~components/UncapStar/UncapStar'
+import UncapStar from '~components/UncapStar'
 
-import './UncapIndicator.css'
+import './index.css'
 
 
 interface Props {
diff --git a/src/components/UncapStar/UncapStar.css b/src/components/UncapStar/index.css
similarity index 100%
rename from src/components/UncapStar/UncapStar.css
rename to src/components/UncapStar/index.css
diff --git a/src/components/UncapStar/UncapStar.tsx b/src/components/UncapStar/index.tsx
similarity index 93%
rename from src/components/UncapStar/UncapStar.tsx
rename to src/components/UncapStar/index.tsx
index de255ab6..e588cb43 100644
--- a/src/components/UncapStar/UncapStar.tsx
+++ b/src/components/UncapStar/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import classnames from 'classnames'
 
-import './UncapStar.css'
+import './index.css'
 
 import Star from '../../../assets/star'
 
diff --git a/src/components/WeaponGrid/WeaponGrid.css b/src/components/WeaponGrid/index.css
similarity index 100%
rename from src/components/WeaponGrid/WeaponGrid.css
rename to src/components/WeaponGrid/index.css
diff --git a/src/components/WeaponGrid/WeaponGrid.tsx b/src/components/WeaponGrid/index.tsx
similarity index 95%
rename from src/components/WeaponGrid/WeaponGrid.tsx
rename to src/components/WeaponGrid/index.tsx
index 42bed465..657598ea 100644
--- a/src/components/WeaponGrid/WeaponGrid.tsx
+++ b/src/components/WeaponGrid/index.tsx
@@ -1,11 +1,10 @@
 import React, { useEffect, useState } from 'react'
 import api from '~utils/api'
-import history from '~utils/history'
 
-import WeaponUnit from '~components/WeaponUnit/WeaponUnit'
-import Button from '~components/Button/Button'
+import WeaponUnit from '~components/WeaponUnit'
+import Button from '~components/Button'
 
-import './WeaponGrid.css'
+import './index.css'
 
 interface Props {
     userId?: string
diff --git a/src/components/WeaponLabelIcon/WeaponLabelIcon.css b/src/components/WeaponLabelIcon/index.css
similarity index 100%
rename from src/components/WeaponLabelIcon/WeaponLabelIcon.css
rename to src/components/WeaponLabelIcon/index.css
diff --git a/src/components/WeaponLabelIcon/WeaponLabelIcon.tsx b/src/components/WeaponLabelIcon/index.tsx
similarity index 90%
rename from src/components/WeaponLabelIcon/WeaponLabelIcon.tsx
rename to src/components/WeaponLabelIcon/index.tsx
index a8ac86bd..7c837db5 100644
--- a/src/components/WeaponLabelIcon/WeaponLabelIcon.tsx
+++ b/src/components/WeaponLabelIcon/index.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import './WeaponLabelIcon.css'
+import './index.css'
 
 interface Props {
     labelType: string
diff --git a/src/components/WeaponResult/WeaponResult.css b/src/components/WeaponResult/index.css
similarity index 100%
rename from src/components/WeaponResult/WeaponResult.css
rename to src/components/WeaponResult/index.css
diff --git a/src/components/WeaponResult/WeaponResult.tsx b/src/components/WeaponResult/index.tsx
similarity index 93%
rename from src/components/WeaponResult/WeaponResult.tsx
rename to src/components/WeaponResult/index.tsx
index 78f4552b..3b7331ac 100644
--- a/src/components/WeaponResult/WeaponResult.tsx
+++ b/src/components/WeaponResult/index.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
-import WeaponLabelIcon from '~components/WeaponLabelIcon/WeaponLabelIcon'
+import WeaponLabelIcon from '~components/WeaponLabelIcon'
 
 import gridImages from '../../images/grid/*.jpg'
 
-import './WeaponResult.css'
+import './index.css'
 
 interface Props {
     data: Weapon
diff --git a/src/components/WeaponUnit/WeaponUnit.css b/src/components/WeaponUnit/index.css
similarity index 100%
rename from src/components/WeaponUnit/WeaponUnit.css
rename to src/components/WeaponUnit/index.css
diff --git a/src/components/WeaponUnit/WeaponUnit.tsx b/src/components/WeaponUnit/index.tsx
similarity index 94%
rename from src/components/WeaponUnit/WeaponUnit.tsx
rename to src/components/WeaponUnit/index.tsx
index fac0ba84..2616411d 100644
--- a/src/components/WeaponUnit/WeaponUnit.tsx
+++ b/src/components/WeaponUnit/index.tsx
@@ -2,14 +2,14 @@ import React, { useEffect, useState } from 'react'
 import classnames from 'classnames'
 import { useModal as useModal } from '~utils/useModal'
 
-import SearchModal from '~components/SearchModal/SearchModal'
-import UncapIndicator from '~components/UncapIndicator/UncapIndicator'
+import SearchModal from '~components/SearchModal'
+import UncapIndicator from '~components/UncapIndicator'
 
 import mainhandImages from '../../images/mainhand/*.jpg'
 import gridImages from '../../images/grid/*.jpg'
 import Plus from '../../../assets/plus.svg'
 
-import './WeaponUnit.css'
+import './index.css'
 
 interface Props {
     onReceiveData: (weapon: Weapon, position: number) => void
diff --git a/src/index.tsx b/src/index.tsx
index 9959e8ed..a6b95ec2 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom'
 import { CookiesProvider } from 'react-cookie'
 import { BrowserRouter } from 'react-router-dom'
 
-import App from './components/App/App'
+import App from './components/App'
 
 ReactDOM.render((
     <BrowserRouter>
diff --git a/src/routes/New/index.tsx b/src/routes/New/index.tsx
index 92eaba87..6460e103 100644
--- a/src/routes/New/index.tsx
+++ b/src/routes/New/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import { RouteComponentProps } from 'react-router-dom'
 import { useCookies } from 'react-cookie'
-import WeaponGrid from '../../components/WeaponGrid/WeaponGrid'
+import WeaponGrid from '../../components/WeaponGrid'
 
 interface Props {}
 interface NewProps extends RouteComponentProps<Props> {}
diff --git a/src/routes/Party/index.tsx b/src/routes/Party/index.tsx
index 20f16000..25dae164 100644
--- a/src/routes/Party/index.tsx
+++ b/src/routes/Party/index.tsx
@@ -3,7 +3,7 @@ import { withCookies, useCookies } from 'react-cookie'
 import { RouteComponentProps, withRouter } from 'react-router-dom'
 import api from '~utils/api'
 
-import WeaponGrid from '../../components/WeaponGrid/WeaponGrid'
+import WeaponGrid from '../../components/WeaponGrid'
 
 interface Props {
     hash: string