mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.91k stars 32.27k forks source link

Any chance this works without using Node in the server side ? #1249

Closed agnivade closed 9 years ago

agnivade commented 9 years ago

I love React and would like to use this framework. But I do not want to use Node in the server side. Any chance this will work without using Node ?

Edit: Sorry, this seems to have been asked before. I saw some comments about compiled libraries being available from 0.8 onwards. But I still see Node being required in the getting started example. Can anyone clarify this ?

cgestes commented 9 years ago

is there a link between node and material-ui?

Material only need a browser to work.

agnivade commented 9 years ago

@cgestes - In the Usage section of this page(http://material-ui.com/#/get-started), the code is written in Node. Maybe I am wrong, but this seems that material-ui needs Node.

cgestes commented 9 years ago

It doesn't.

You need npm to easily install it and compile it, but node is not required as far as I know. (I'am using it on mobile for example).

just launch webpack and use the resulting JS as you desire.

inoc603 commented 9 years ago

@agnivade The code in the examples is not server-side code, and it's written in a style like Node mainly because npm is the preferred way of managing your dependencies like React and material-ui itself. They are JavaScript after all.

You can use build tools like browserify, webpack, requirejs or whatever tools to your liking to build it and make it actually run in the browser.

agnivade commented 9 years ago

Perfect. Thanks a lot guys !

cgestes commented 9 years ago

we miss starter kits, and examples.

(we have a bug about it)

On Thu, Jul 23, 2015 at 10:35 AM, Agniva De Sarker <notifications@github.com

wrote:

Perfect. Thanks a lot guys !

— Reply to this email directly or view it on GitHub https://github.com/callemall/material-ui/issues/1249#issuecomment-124021930 .

agnivade commented 9 years ago

Totally agree.

Sorry to be a bother again, seems like I am stuck. (First time using browserify and React, sorry if this seems simple)

Here's what I am doing - I am trying to browserify the js files from the /build folder after doing the npm install. cd material-ui/lib/index.js browserify index.js -o components.js

Now I have included components.js in my html file.

And inside a React class of my own, I am trying to use the AppBar component like this -

But when loading the page, the browser says AppBar is not defined.

I am using the example html from the React website.

<!DOCTYPE html>
<html>
  <head>
    <title>Hello React</title>
    <!-- Not present in the tutorial. Just for basic styling. -->
    <link rel="stylesheet" href="css/base.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.0/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
  </head>
  <body>
    <div id="content"></div>
    <script src="build/components.js"></script>  <--- I have added this
    <script src="build/example.js"></script>
  </body>
</html>

This is my code in example.js

 var CommentBox = React.createClass({
     render: function() {
           return (
                 <div className="commentBox">
                 <h1>Comments</h1>
                 <AppBar  title="Title"  iconClassNameRight="muidocs-icon-navigation-expand-more" />
                 <CommentList data={data}/>
                 <CommentForm />
                  </div>
                  );
    }
 });

Any help is highly appreciated. Thanks !

saeedalzdh-zz commented 8 years ago

Hello dears,

I am gonna integrate angularJS and react together, I used react just as view in whole of application, now everything is fine but the question is how could I integrate it with Material UI cause I have to use react by JSX inside of my angular controllers and finally by gulp and browserify handle it and if I wana use Material UI I have to use npm and so on, is there any tips please?