Skip to content

Commit 0a1146c

Browse files
seneyuseneyu
committed
Merge branch 'dev' into stephany/readme-2
2 parents 1765a3b + 206ecc2 commit 0a1146c

File tree

7 files changed

+63
-41
lines changed

7 files changed

+63
-41
lines changed

‎mlflow-site/public/assets/winstonpfp-square.png

100 KB
Loading

‎mlflow-site/public/assets/winstonpfp.png

-1.19 MB
Binary file not shown.

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

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,23 @@ const Demo = () => {
99
];
1010
const demoCardBlurbs = [
1111
'Create experiments with MLflow.js. Using built-in workflows, manage complex operations easily.',
12-
'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.',
13-
'Once the run completes, the MLflow UI provides powerful visualization tools to analyze experiments. Compare training and testing metrics across different runs to track performance patterns, or create custom charts that combine any logged hyperparameters and metrics to identify optimal model configurations'
12+
<>
13+
This example demonstrates how to use MLflow.js to support a full ML
14+
project with TensorFlow.js. It covers logging hyperparameters and metrics
15+
during training, evaluating model performance, registering high-performing
16+
models, and exploring results in the MLflow UI. Check out the full code
17+
example on{' '}
18+
<a
19+
href="https://github.com/oslabs-beta/mlflow-js/blob/dev/mlflow/examples/LinearRegressionExample.js"
20+
target="_blank"
21+
rel="noopener noreferrer"
22+
style={{ color: 'blue', textDecoration: 'underline' }}
23+
>
24+
GitHub
25+
</a>
26+
.
27+
</>,
28+
'Once the run completes, the MLflow UI provides powerful visualization tools to analyze experiments. Compare training and testing metrics across different runs to track performance patterns, or create custom charts that combine any logged hyperparameters and metrics to identify optimal model configurations',
1429
];
1530
const demoCardVideos = [
1631
'https://player.vimeo.com/video/1023585657',

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ import FeatureCard from "./FeatureCard";
33
const Features = () => {
44
const featureHeader = 'MLOps in Javascript, made simple.';
55
const featureLongBlurb = `
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.
6+
MLflow.js is an open source JavaScript client library, bringing MLflow's powerful capabilities to JavaScript and TypeScript environments. It makes machine learning experimentation and model management intuitive for JavaScript developers through a clean, Promise-based API. Built with TypeScript, it provides comprehensive access to MLflow's REST API while adding streamlined abstractions for common ML workflows. Whether you're tracking experiments with TensorFlow.js, automating retraining pipelines, or managing A/B tests, MLflow.js helps you organize and version everything in one place.
7+
78
`;
89
const cards = [];
910
const featureCardHeaders = [

‎mlflow-site/src/app/components/Headline.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,12 @@ import Button from './Button';
22

33
const Headline = () => {
44
return (
5-
<div className='home' id='headline'>
6-
<div className='bigHeadline'>MLOps workflow for Javascript</div>
7-
<div className='headLineText'>Harness MLflow&apos;s MLOps functionality for your Javascript application with MLflow.js</div>
5+
<div className="home" id="headline">
6+
<div className="bigHeadline">ML workflow for Javascript</div>
7+
<div className="headLineText">
8+
Harness MLflow&apos;s functionality for your Javascript application with
9+
MLflow.js
10+
</div>
811
<Button />
912
</div>
1013
);

‎mlflow-site/src/app/components/Team.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const Team = () => {
3030
name: 'Winston Ludlam',
3131
github: 'https://github.com/winjolu/',
3232
linkedIn: 'https://www.linkedin.com/in/wjludlam/',
33-
pfp: '/assets/winstonpfp.png',
33+
pfp: '/assets/winstonpfp-square.png',
3434
},
3535
];
3636

‎mlflow-site/src/app/documentation/page.tsx

Lines changed: 37 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1361,7 +1361,7 @@ export default function Documentation() {
13611361
{
13621362
name: 'Cleanup Runs',
13631363
description:
1364-
'Delete runs that do not meet certain criteria and return deleted runs.',
1364+
'Deletes runs that do not meet certain criteria and return deleted runs.',
13651365
requestProps: [
13661366
{
13671367
name: 'experiment_ids',
@@ -1392,7 +1392,7 @@ export default function Documentation() {
13921392
{
13931393
name: 'Copy Run',
13941394
description:
1395-
'Copy run from one experiment to another without artifacts and models. Artifacts and models detail tagged in new run as reference.',
1395+
'Copies run from one experiment to another without artifacts and models. Artifacts and models detail tagged in new run as reference.',
13961396
requestProps: [
13971397
{
13981398
name: 'run_id',
@@ -1416,21 +1416,21 @@ export default function Documentation() {
14161416
];
14171417

14181418
return (
1419-
<div className='documentationWrapper'>
1420-
<div className='documentationHeader'>
1421-
<a href='/' className='documentationImageLink'>
1419+
<div className="documentationWrapper">
1420+
<div className="documentationHeader">
1421+
<a href="/" className="documentationImageLink">
14221422
<Image
14231423
src={'/assets/MLflow-js-logo.png'}
14241424
width={144}
14251425
height={38.4}
1426-
alt='G'
1427-
className='documentationImage'
1426+
alt="G"
1427+
className="documentationImage"
14281428
/>
14291429
</a>
14301430
</div>
1431-
<div className='documentationLeftSideBar'>
1431+
<div className="documentationLeftSideBar">
14321432
<div
1433-
className='documentationLeftHeader'
1433+
className="documentationLeftHeader"
14341434
onClick={() => {
14351435
const element = document.getElementById(`methodsHeader`);
14361436
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1439,7 +1439,7 @@ export default function Documentation() {
14391439
Mlflow.js Methods
14401440
</div>
14411441
<div
1442-
className='documentationLeftHeader2'
1442+
className="documentationLeftHeader2"
14431443
onClick={() => {
14441444
const element = document.getElementById(`experimentClientHeader`);
14451445
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1454,7 +1454,7 @@ export default function Documentation() {
14541454
/>
14551455
))}
14561456
<div
1457-
className='documentationLeftHeader2'
1457+
className="documentationLeftHeader2"
14581458
onClick={() => {
14591459
const element = document.getElementById(`runClientHeader`);
14601460
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1469,7 +1469,7 @@ export default function Documentation() {
14691469
/>
14701470
))}
14711471
<div
1472-
className='documentationLeftHeader2'
1472+
className="documentationLeftHeader2"
14731473
onClick={() => {
14741474
const element = document.getElementById(
14751475
`modelRegistryClientHeader`
@@ -1486,7 +1486,7 @@ export default function Documentation() {
14861486
/>
14871487
))}
14881488
<div
1489-
className='documentationLeftHeader2'
1489+
className="documentationLeftHeader2"
14901490
onClick={() => {
14911491
const element = document.getElementById(`modelVersionClientHeader`);
14921492
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1501,7 +1501,7 @@ export default function Documentation() {
15011501
/>
15021502
))}
15031503
<div
1504-
className='documentationLeftHeader2'
1504+
className="documentationLeftHeader2"
15051505
onClick={() => {
15061506
const element = document.getElementById(`experimentManagerHeader`);
15071507
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1516,7 +1516,7 @@ export default function Documentation() {
15161516
/>
15171517
))}
15181518
<div
1519-
className='documentationLeftHeader2'
1519+
className="documentationLeftHeader2"
15201520
onClick={() => {
15211521
const element = document.getElementById(`runManagerHeader`);
15221522
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1531,7 +1531,7 @@ export default function Documentation() {
15311531
/>
15321532
))}
15331533
<div
1534-
className='documentationLeftHeader2'
1534+
className="documentationLeftHeader2"
15351535
onClick={() => {
15361536
const element = document.getElementById(`modelManagerHeader`);
15371537
element?.scrollIntoView({ behavior: 'smooth' });
@@ -1546,25 +1546,28 @@ export default function Documentation() {
15461546
/>
15471547
))}
15481548
</div>
1549-
<div className='documentationMainWrapper'>
1550-
<div className='documentationMain'>
1551-
<div className='methodsHeader' id='methodsHeader'>
1549+
<div className="documentationMainWrapper">
1550+
<div className="documentationMain">
1551+
<div className="methodsHeader" id="methodsHeader">
15521552
Methods
15531553
</div>
1554-
<span className='mlFlowReference'>
1554+
<span className="mlFlowReference">
15551555
The Mlflow.js library implements a JavaScript interface to
1556-
Mlflow&apos;s functionality by utilizing the official MLflow REST
1557-
API. For detailed information about the underlying API endpoints,
1558-
please refer here (
1556+
Mlflow&apos;s functionality by utilizing the MLflow REST API. For
1557+
detailed information about the underlying API endpoints, please
1558+
refer the official MLflow documentation{' '}
15591559
<a
1560-
href='https://mlflow.org/docs/latest/rest-api.html'
1561-
className='mlFlowOfficialLink'
1560+
href="https://mlflow.org/docs/latest/rest-api.html"
1561+
className="mlFlowOfficialLink"
1562+
target="_blank"
1563+
rel="noopener noreferrer"
15621564
>
1563-
https://mlflow.org/docs/latest/rest-api.html
1565+
here
15641566
</a>
1565-
).
1567+
.
15661568
</span>
1567-
<div id='experimentClientHeader' className='methodsHeader2'>
1569+
1570+
<div id="experimentClientHeader" className="methodsHeader2">
15681571
Experiment Client Methods
15691572
</div>
15701573
{experimentClientMethods.map((method, index) => (
@@ -1577,7 +1580,7 @@ export default function Documentation() {
15771580
responseDescription={method.responseDescription}
15781581
/>
15791582
))}
1580-
<div id='runClientHeader' className='methodsHeader2'>
1583+
<div id="runClientHeader" className="methodsHeader2">
15811584
Run Client Methods
15821585
</div>
15831586
{runClientMethods.map((method, index) => (
@@ -1590,7 +1593,7 @@ export default function Documentation() {
15901593
responseDescription={method.responseDescription}
15911594
/>
15921595
))}
1593-
<div id='modelRegistryClientHeader' className='methodsHeader2'>
1596+
<div id="modelRegistryClientHeader" className="methodsHeader2">
15941597
Model Registry Client Methods
15951598
</div>
15961599
{modelRegistryClientMethods.map((method, index) => (
@@ -1603,7 +1606,7 @@ export default function Documentation() {
16031606
responseDescription={method.responseDescription}
16041607
/>
16051608
))}
1606-
<div id='modelVersionClientHeader' className='methodsHeader2'>
1609+
<div id="modelVersionClientHeader" className="methodsHeader2">
16071610
Model Version Client Methods
16081611
</div>
16091612
{modelVersionClientMethods.map((method, index) => (
@@ -1616,7 +1619,7 @@ export default function Documentation() {
16161619
responseDescription={method.responseDescription}
16171620
/>
16181621
))}
1619-
<div id='experimentManagerHeader' className='methodsHeader2'>
1622+
<div id="experimentManagerHeader" className="methodsHeader2">
16201623
Experiment Manager Methods
16211624
</div>
16221625
{experimentManagerMethods.map((method, index) => (
@@ -1629,7 +1632,7 @@ export default function Documentation() {
16291632
responseDescription={method.responseDescription}
16301633
/>
16311634
))}
1632-
<div id='runManagerHeader' className='methodsHeader2'>
1635+
<div id="runManagerHeader" className="methodsHeader2">
16331636
Run Manager Methods
16341637
</div>
16351638
{runManagerMethods.map((method, index) => (
@@ -1642,7 +1645,7 @@ export default function Documentation() {
16421645
responseDescription={method.responseDescription}
16431646
/>
16441647
))}
1645-
<div id='modelManagerHeader' className='methodsHeader2'>
1648+
<div id="modelManagerHeader" className="methodsHeader2">
16461649
Model Manager Methods
16471650
</div>
16481651
{modelManagerMethods.map((method, index) => (

0 commit comments

Comments
 (0)