Skip to content

Commit 9528fc5

Browse files
committed
Merge branch 'dev' into yiqun/new
2 parents dcddf57 + 3382ea0 commit 9528fc5

File tree

20 files changed

+340
-195
lines changed

20 files changed

+340
-195
lines changed
Lines changed: 34 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
11
<div style="text-align: center">
2-
<img src="mlflow-site/public/assets/mlflow-js-logo-whitebg.png" width=600px;"/></div>
2+
<img src="../mlflow-site/public/assets/mlflow-js-logo-whitebg.png" width=600px;"/></div>
33

44
<br>
55

66
## About
77

8-
[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](/LICENSE)
8+
[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](../LICENSE)
99
![Release](https://img.shields.io/badge/Release-v1.0.0-426B20)
1010
![Build](https://img.shields.io/badge/Build-Passing-brightgreen.svg)
11-
![Coverage](https://img.shields.io/badge/Coverage-80%25-c7ea46.svg)
12-
[![Contributions](https://img.shields.io/badge/Contributions-Welcome-brightgreen.svg)](/CONTRIBUTING.md)
11+
![Coverage](https://img.shields.io/badge/Coverage-87%25-c7ea46.svg)
12+
[![Contributions](https://img.shields.io/badge/Contributions-Welcome-brightgreen.svg)](../CONTRIBUTING.md)
1313

1414
<i>mlflow.js</i> is an open-source npm library designed for JavaScript developers who want to integrate with MLflow, providing tools and functionalities for managing machine learning lifecycle.
1515

16-
<a href="">Visit the official mlflow.js site for more info!</a>
16+
<a href="https://www.mlflow-js.org/">Visit the official <i>mlflow.js</i> site for more info!</a>
1717

1818
Visit our LinkedIn page below:
1919

@@ -23,15 +23,15 @@ Visit our LinkedIn page below:
2323

2424
## Features
2525

26-
<i>mlflow.js</i> covers all REST API endpoints under MLflow's Tracking Server and Model Registry. Official documentation for MLflow.js can be found <a href="">here</a>. Moreover, high-level abstraction workflows have been developed to facilitate developers' work processes.
26+
<i>mlflow.js</i> covers all REST API endpoints under MLflow's Tracking Server and Model Registry. Official documentation for <i>mlflow.js</i> can be found <a href="https://www.mlflow-js.org/documentation">here</a>. Moreover, high-level abstraction workflows have been developed to facilitate developers' work processes.
2727

2828
### High-Level Abstraction Workflows
2929

3030
**Experiment Manager**
3131

3232
- runExistingExperiment - Full workflow of creating, naming, and starting a run under an existing experiment, logging metrics, params, tags, and the model, and finishing the run
33-
- runNewExperiment - Full workflow of creating, naming, and starting a run under a new experiment, ogging mettrics, params,tags, and the model, and finishing the run
34-
- experimentSummary - Returns an array of all the passed-in experiment's runs, sorted accoroding to the passed-in metric
33+
- runNewExperiment - Full workflow of creating, naming, and starting a run under a new experiment, logging metrics, params, tags, and the model, and finishing the run
34+
- experimentSummary - Returns an array of all the passed-in experiment's runs, sorted according to the passed-in metric
3535

3636
**Run Manager**
3737

@@ -40,9 +40,15 @@ Visit our LinkedIn page below:
4040

4141
**Model Manager**
4242

43-
- createRegisteredModelWithVersion - Creates a new registered model and the frist version of that model
43+
- createRegisteredModelWithVersion - Creates a new registered model and the first version of that model
4444
- updateRegisteredModelDescriptionAndTag - Updates a registered model's description and tags
45-
- updateAllLatestModelVersion - Updates the latest version of the specified registered model's description, adds a new alias, and tag key/value foro tthat latest version
45+
- updateAllLatestModelVersion - Updates the latest version of the specified registered model's description, adds a new alias, and tag key/value for the latest version
46+
- setLatestModelVersionTag - Adds a new tag key/value for the latest version of the specified registered model
47+
- setLatestModelVersionAlias - Adds an alias for the latest version of the specified registered model
48+
- updateLatestModelVersion - Updates the description of the latest version of a registered model
49+
- updateAllModelVersion - Updates the specified version of the specified registered model's description and adds a new alias and tag key/value for that specified version
50+
- deleteLatestModelVersion - Deletes the latest version of the specified registered model
51+
- createModelFromRunWithBestMetric - Creates a new model with the specified model name from the run with the best specified metric
4652

4753
<br>
4854

@@ -73,7 +79,7 @@ Ensure MLflow is installed on your system:
7379
pip install mlflow
7480
```
7581

76-
Note: MLflow is compatible with MacOS. If you encountner issues with the default system Python, consider installing Python 3 via the Homebrew package manger using `brew install python`. In this case, installing MLflow is now `pip3 install mlflow`.
82+
**Note:** MLflow is compatible with MacOS. If you encounter issues with the default system Python, consider installing Python 3 via the Homebrew package manger using `brew install python`. In this case, installing MLflow is now `pip3 install mlflow`.
7783

7884
### Start the MLflow Tracking Server
7985

@@ -89,66 +95,60 @@ This will launch the MLflow UI on your local machine at `http://localhost:5000`.
8995

9096
## Quickstart
9197

92-
### Install MLflow.js Library
98+
### Install <i>mlflow.js</i> Library
9399

94-
To use the MLflow.js library, navigate to your project directory and install it via npm:
100+
To use the <i>mlflow.js</i> library, navigate to your project directory and install it via npm:
95101

96102
```bash
97103
npm install mlflow-js
98104
```
99105

100106
### Usage Example
101107

102-
Here is an example of how to use the MLflow.js library to create an experiment:
108+
Here is an example of how to use the <i>mlflow.js</i> library to create an experiment:
103109

104110
```JavaScript
105111
import Mlflow from 'mlflow-js';
106112

107113
// Initialize the MLflow client
108-
const mlflow = new Mlflow('http://127.0.0.1:5000');
109-
110-
// Get the experiment client
111-
const experimentClient = mlflow.getExperimentClient();
114+
const mlflow = new Mlflow(process.env.MLFLOW_TRACKING_URI);
112115

113116
// Create a new experiment
114117
async function createExperiment(){
115-
try {
116-
await experimentClient.createExperiment('My Experiment');
117-
console.log('Experiment created successfully');
118-
} catch (error) {
119-
console.error('Error creating experiment:', error);
120-
}
118+
await mlflow.createExperiment('My Experiment');
119+
console.log('Experiment created successfully');
121120
}
122121

123122
createExperiment();
123+
124124
```
125125

126126
<br>
127127

128128
## Documentation
129129

130-
Official documentation for MLflow.js can be found <a href="">here</a>.
130+
Official documentation for <i>mlflow.js</i> can be found <a href="https://www.mlflow-js.org/documentation">here</a>.
131131

132132
<br>
133133

134134
## Contributing
135135

136-
We welcome contributions to mlflow.js! Please see our [Contributing Guide](CONTRIBUTING.md) for more details on how to get started.
136+
We welcome contributions to <i>mlflow.js</i>! Please see our [Contributing Guide](../CONTRIBUTING.md) for more details on how to get started.
137137

138138
<br>
139139

140140
## License
141141

142-
[MIT](/LICENSE)
142+
[MIT License](../LICENSE)
143143

144144
<br>
145145

146146
## Meet The Team
147147

148-
| Name | GitHub | LinkedIn |
149-
| -------------- | ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
150-
| Kyler Chiago | [![GitHub](https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=github)](https://github.com/Kyler-Chiago) | [![LinkedIn](https://img.shields.io/badge/-LinkedIn-0077B5?style=flat-square&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/kyler-chiago/) |
151-
| Austin Fraser | [![GitHub](https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=github)](https://github.com/austinbfraser) | [![LinkedIn](https://img.shields.io/badge/-LinkedIn-0077B5?style=flat-square&logo=linkedin&logoColor=white)](http://www.linkedin.com/in/austin-fraser) |
152-
| Stephany Ho | [![GitHub](https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=github)](https://github.com/seneyu) | [![LinkedIn](https://img.shields.io/badge/-LinkedIn-0077B5?style=flat-square&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/stephanyho/) |
153-
| Winston Ludlam | [![GitHub](https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=github)](https://github.com/winjolu/) | [![LinkedIn](https://img.shields.io/badge/-LinkedIn-0077B5?style=flat-square&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/wjludlam/) |
154-
| Yiqun Zheng | [![GitHub](https://img.shields.io/badge/-GitHub-181717?style=flat-square&logo=github)](https://github.com/yiqunzheng) | [![LinkedIn](https://img.shields.io/badge/-LinkedIn-0077B5?style=flat-square&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/yiqunzheng/) |
148+
| Name | GitHub | LinkedIn |
149+
| -------------- | ------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
150+
| Yiqun Zheng | [![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github)](https://github.com/yiqunzheng) | [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/yiqunzheng/) |
151+
| Kyler Chiago | [![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github)](https://github.com/Kyler-Chiago) | [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/kyler-chiago/) |
152+
| Austin Fraser | [![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github)](https://github.com/austinbfraser) | [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](http://www.linkedin.com/in/austin-fraser) |
153+
| Stephany Ho | [![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github)](https://github.com/seneyu) | [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/stephanyho/) |
154+
| Winston Ludlam | [![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github)](https://github.com/winjolu/) | [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/wjludlam/) |

CONTRIBUTING.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,16 +16,17 @@ cd mlflow && npm install
1616
cd ../mlflow-site && npm install
1717
```
1818

19-
4. Run the mlflow-site
19+
4. Create your feature branch
2020

2121
```bash
22-
npm run dev
22+
git checkout -b feature/AmazingFeature
2323
```
2424

25-
5. Create your feature branch
25+
5. Run MLflow Tracking Server container with Docker
2626

2727
```bash
28-
git checkout -b feature/AmazingFeature
28+
cd mlflow
29+
npm run docker
2930
```
3031

3132
6. Make your changes
456 KB
Loading
523 KB
Loading

mlflow-site/public/assets/yiqun.png

112 KB
Loading

mlflow-site/src/app/components/Button.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,14 @@ const Button = () => {
44
return (
55
<div className='button'>
66
<a
7-
href='https://github.com/oslabs-beta/mlflow-js'
8-
className='homeButton homeButtonDownload text-white'
7+
href='https://www.npmjs.com/package/mlflow-js'
98
>
10-
Download
9+
<button className='homeButton homeButtonDownload text-white'>Download</button>
1110
</a>
1211
<a
1312
href='/documentation'
14-
className='homeButton homeButtonRead'
1513
>
16-
Read the Docs
14+
<button className='homeButton homeButtonRead'>Read the Docs</button>
1715
</a>
1816
</div>
1917
);

mlflow-site/src/app/components/Demo.tsx

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,17 @@ import DemoCard from "./DemoCard";
33
const Demo = () => {
44
const demos = [];
55
const demoCardHeaders = [
6-
'Demo 1',
7-
'Demo 2',
8-
'Demo 3'
6+
'Manage experiments',
7+
'Complete workflow',
98
];
109
const demoCardBlurbs = [
11-
'Description for what\'s happening in Demo 1. This block of text will contain all the info needed to understand the demo.',
12-
'Description for what\'s happening in Demo 2. This block of text will contain all the info needed to understand the demo.',
13-
'Description for what\'s happening in Demo 3. This block of text will contain all the info needed to understand the demo.'
10+
'Create experiments with MLflow.js. Using built-in workflows, manage complex operations easily.',
11+
'Use MLflow.js to support a full ML project with TensorFlow.js. Log hyperparameters and key metrics during each training step. Evaluate model performance and register succesful models.',
1412
];
1513
const demoCardVideos = [
1614
'https://player.vimeo.com/video/1023585657',
17-
'',
18-
'',
15+
'https://player.vimeo.com/video/1029068988',
16+
1917
];
2018
for (let i = 0; i < 3; i++) {
2119
demos.push(

mlflow-site/src/app/components/Features.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,20 @@ import FeatureCard from "./FeatureCard";
33
const Features = () => {
44
const featureHeader = 'MLOps in Javascript, made simple.';
55
const featureLongBlurb = `
6-
Longer blurb about MLFlow.js\'s feature set. Longer blurb about MLFlow.js\'s feature set. Longer blurb about MLFlow.js\'s feature set. Longer blurb about MLFlow.js\'s feature set. Longer blurb about MLFlow.js\'s feature set. Longer blurb about MLFlow.js\'s feature set.
6+
MLflow.js makes ML experimentation and model management seamless for JavaScript developers. Built with TypeScript, it provides intuitive access to MLflow\'s complete REST API while adding powerful abstractions for common ML workflows. Whether you\'re training models with TensorFlow.js, managing A/B tests, or monitoring production models, MLflow.js helps you track everything in one place.
77
`;
88
const cards = [];
99
const featureCardHeaders = [
10-
'Feature 1',
11-
'Feature 2',
12-
'Feature 3',
13-
'Feature 4',
10+
'Effortless integration',
11+
'Streamlined MLOps',
12+
'For the modern web developer',
13+
'Dive deeper',
1414
];
1515
const featureCardBlurbs = [
16-
'Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. Feature Card Blurb 1. ',
17-
'Feature Card Blurb 2. Feature Card Blurb 2. Feature Card Blurb 2. Feature Card Blurb 2. ',
18-
'Feature Card Blurb 3. Feature Card Blurb 3. Feature Card Blurb 3. Feature Card Blurb 3. ',
19-
'Feature Card Blurb 4. Feature Card Blurb 4. Feature Card Blurb 4. Feature Card Blurb 4. '
16+
'Connect your JavaScript stack directly to MLflow with minimal setup.',
17+
'Automate key MLOps tasks directly from Node.js, simplifying workflow management. Manage experiments, runs, model registry and model version management with dedicated methods.',
18+
'Designed specifically for JavaScript developers: no Python knowledge required.',
19+
'Execute complex MLOps tasks with a single function call with MLflow.js\'s powerful built-in workflows.'
2020

2121
];
2222
for (let i = 0; i < 4; i++) {

mlflow-site/src/app/components/Method.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const Method: React.FC<MethodIndividualProps> = ({
2020
<div className='methodName'>{name}</div>
2121
<div className='methodDescription'>{description}</div>
2222
<div>
23-
<div className='responseStructure'>Request Structure</div>
23+
<div className='responseStructure'>Parameters</div>
2424
<div className='requestStructureWrapper'>
2525
<div className='methodRequest mRHeader'>
2626
<div className='methodRequestLeft textLeftPadding'>Field Name</div>
@@ -39,7 +39,7 @@ const Method: React.FC<MethodIndividualProps> = ({
3939
/>
4040
))}
4141
</div>
42-
<div className='responseStructure'>Response</div>
42+
<div className='responseStructure'>Returns</div>
4343
<div className='responseFormat responseFormatHeader'>
4444
<div className='methodRequestLeft textLeftPadding'>Type</div>
4545
<div className='methodRequestMid textLeftPadding'>Description</div>

mlflow-site/src/app/components/NavBar.tsx

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,15 @@ import Image from 'next/image';
55
const NavBar = () => {
66
return (
77
<div className='navBar'>
8-
<div className='navBarMlflow'><Image src={'/assets/MLflow-js-logo.png'} width={64} height={32} alt='G' className='mlflow-logo'/></div>
8+
<div className='navBarMlflow'>
9+
<Image
10+
src={'/assets/MLflow-js-logo.png'}
11+
width={100}
12+
height={32}
13+
alt='G'
14+
className='mlflow-logo'
15+
/>
16+
</div>
917
<div className='navBarLinks'>
1018
<button
1119
onClick={() => {
@@ -47,7 +55,13 @@ const NavBar = () => {
4755
href='https://github.com/oslabs-beta/mlflow-js'
4856
className='navBarLinksGithub'
4957
>
50-
<Image src={'/assets/GithubLogo.png'} width={24} height={24} alt='G' className='navbarGithub'/>
58+
<Image
59+
src={'/assets/GithubLogo.png'}
60+
width={24}
61+
height={24}
62+
alt='G'
63+
className='navbarGithub'
64+
/>
5165
</a>
5266
</div>
5367
</div>

0 commit comments

Comments
 (0)