Docklight - GitLite

KO | EN

gitlite — search

#javascript #hacktoberfest #golang #go #android #deep-learning #docker #macos #nodejs #java #pytorch #security #mcp #openai

Docklight

(★ 107)

Metrics for your Docker containers

파일 탐색기

최종 버전 다운로드 (.zip)

- react-test.js
- server-test.js
- TestContainer.tsx
- bundle.js
- bundle.js.LICENSE.txt
- index.html
- - Anna-pic.jpg
  - conimage.png
  - Dennis-photo.jpg
  - docklightlogo-removebg.png
  - docklightlogo.png
  - IMG_2699-removebg-preview.png
  - individualgif.gif
  - logo-nobg-noletters-preview.png
  - overviewgif.gif
  - Rama-photo.png
- - BarChart.tsx
  - LineChart.tsx
  - StatChart.tsx
- - Active.tsx
  - Container.tsx
  - Error.tsx
  - InactiveContainers.tsx
  - MissingContainers.tsx
  - Notifications.tsx
  - OverviewContainer.tsx
  - SearchContainers.tsx
- - DataOverview.tsx
  - Homepage.tsx
  - Navbar.tsx
  - Team.tsx
  - YourContainers.tsx
- - Loader.tsx
- App.tsx
- index.html
- index.tsx
- style.css
- - base.css
  - block-navigation.js
  - favicon.png
  - index.html
  - prettify.css
  - prettify.js
  - sort-arrow-sprite.png
  - sorter.js
- clover.xml
- coverage-final.json
- lcov.info
- - ContainerMountController.ts
  - ContainerStreamController.ts
- - ContainerRoute.ts
- app.ts
- server.ts
- index.d.ts
.babelrc.js
.eslintrc.json
.gitignore
jest-setup.js
jest-teardown.js
jest.config.js
LICENSE
package-lock.json
package.json
postcss.config.js
README.md
tailwind.config.js
tsconfig.json
webpack.config.js

# 설치 가이드

1. 코드 내려받기

git clone https://github.com/oslabs-beta/Docklight

깃허브에서 프로젝트 코드 전체를 내 컴퓨터로 내려받습니다.

cd Docklight

방금 내려받은 프로젝트 폴더 안으로 이동합니다.

2. Node.js

쉬움 추천

사전 준비물

Git GitHub에서 프로젝트 코드를 내려받으려면 필요합니다.
Node.js npm 명령어를 쓰려면 Node.js가 설치되어 있어야 합니다. LTS(장기지원) 버전을 추천합니다.

npm install

package.json에 명시된 라이브러리들을 내려받아 설치합니다.

npm run dev

개발/실행 서버를 켭니다.

✅ 명령어 실행 후 터미널에 나타나는 주소(보통 http://localhost:3000 형태)를 브라우저에서 열어보세요.

이 레포의 README에 적힌 실제 명령어를 그대로 가져왔습니다.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

<h1 align="center">
  <a href="https://docklight.dev" target="_blank">
    <img 
        style="display: block; 
              margin-left: auto;
              margin-right: auto;
              "
        src="Client/assets/docklightlogo.png" 
        height=300
        alt="Docklight">
    </img>
  </a>
</h1>

<h3 align="center"><strong>A GUI for your Docker container metrics</strong></h3>

<div align="center">
  <a href="https://docklight.dev" target="_blank">
    <img src="https://img.shields.io/badge/website-docklight-teal.svg" />
  </a>
  <img alt="license" src="https://img.shields.io/badge/License-MIT-green.svg">
  <img alt="last-commit" src="https://img.shields.io/github/last-commit/oslabs-beta/docklight?color=orange">
</div>
<br/>

**Docklight** is a container metrics monitoring solution that makes organizing, monitoring, and visualizing your metrics easy. The Docklight GUI interface is clean, easy to understand, and provides you with all of the information you need to manage and monitor your Docker containers outside of the Docker Desktop.

# How does it work?

After installing **Docklight**, you can run it natively on your localhost. The application will speak to your Docker Daemon and provide you with real-time, live-streamed data in charts that update as your data changes.

<p align="center">
  <img src="Client/assets/individualgif.gif" width="600px" margin="auto"/>
</p>

## Get a micro and macro view of your data

With **Docklight**, you can see an overall average of your data in addition to tracking the metrics of your individual containers. You also have the option of viewing your containers sorted by active and inactive, and starting and stopping them with the click of a button from within the GUI.

<p align="center">
  <img src="Client/assets/overviewgif.gif" width="600px" margin="auto"/>
</p>

<p align="center">
  <img src="Client/assets/conimage.png" width="600px" margin="auto"/>
</p>

# How to get **Docklight**

First:

```
git clone https://github.com/oslabs-beta/Docklight.git
```

Clone our repository onto your local machine.

Next:

```
npm install
```

Install any dependencies you might need to run this repo.

**Make sure your Docker Desktop app is running before this next step. Otherwise, Docklight won't be able to reach your Daemon!**

Please also keep in mind that Docklight uses ports **8080** and **3000**.

Finally:

```
npm run dev
```

Run our application and view your data!

# Contributing
Please submit a pull request or reach out to us if you're interested in improving **Docklight**!

# Contributors
<ul>
  <li>
    Luis Gomez
    <a href="https://www.linkedin.com/in/luisgomezo/" target="_blank">
      <img src="https://img.shields.io/badge/LinkedIn-0077B5?style=social&logo=linkedin" />
    </a>
      <a href="https://github.com/Luisortzg" target="_blank">
      <img src="https://img.shields.io/badge/Github-0077B5?style=social&logo=github" />
    </a>
  </li>
  <li>
    Anna Larouche
    <a href="https://www.linkedin.com/in/anna-larouche" target="_blank">
      <img src="https://img.shields.io/badge/LinkedIn-0077B5?style=social&logo=linkedin" />
    </a>
      <a href="https://github.com/amlarouche" target="_blank">
      <img src="https://img.shields.io/badge/Github-0077B5?style=social&logo=github" />
    </a>
  </li>
  <li>
    Dennis Park
    <a href="https://www.linkedin.com/in/dennishpark/" target="_blank">
      <img src="https://img.shields.io/badge/LinkedIn-0077B5?style=social&logo=linkedin" />
    </a>
      <a href="https://github.com/hdennispark" target="_blank">
      <img src="https://img.shields.io/badge/Github-0077B5?style=social&logo=github" />
    </a>
  </li>
  <li>
    Andrew Rama
    <a href="https://www.linkedin.com/in/andrew-rama-075b3a145/" target="_blank">
      <img src="https://img.shields.io/badge/LinkedIn-0077B5?style=social&logo=linkedin" />
    </a>
      <a href="https://github.com/RamaSaga" target="_blank">
      <img src="https://img.shields.io/badge/Github-0077B5?style=social&logo=github" />
    </a>
  </li>
</ul>

# Resources
Built using React, Typescript, and Tailwind