These are chat archives for jdubray/sam

2nd
Jul 2016
dnson
@imnutz
Jul 02 2016 04:15
Ftuji. Call romantic man I got 200
Scott Conklin
@srconklin
Jul 02 2016 18:45
I have a couple questions about the sbadmin template as I still try to wrap my mind around SAM a bit as a beginner.
Would the approach of componentizing every single aspect of the HTML (theme.html , theme.head etc,) something that you would do when building a client side app? Or is this more intended to be a server side strategy only? I saw this example here https://bitbucket.org/snippets/jdubray/jna7B/sam-sample-app-on-nodejs where the entire html is assembled on each app.get request via the theme.viewContainer function.
But this would not work so well in the case of a client side app if you need smooth content refresh fired on user certain actions.. (imagine sliding a slider and updating a label)? OR am i missing something?
Maybe the intent is to init the page the first time in this fashion and then further user actions need only update the relevant content changes in the view?
if so, why would I need to take the time to go through the exercise of creating all those granular functions for the html components if they don't change? like a theme.footer when i can just statically add that to the index.html page ?
to add what I said above.. I think I have always had a difficult time reasoning about SPA's vs a traditional web app with page refreshes on every click/action.. Maybe that is part of mind block on all of this?
Jean-Jacques Dubray
@jdubray
Jul 02 2016 18:52
Scott, welcome to this forum.
SAM works both on the client and the server, as well as a combination of both.
First, I would argue that SAM should make it easier to think in terms of SPA because of the "functional HTML" where the view is expressed as a function of the model. There is no longer a notion of "page", you update the model in a way that is unknown from the view. The view then renders the current state of the model
Jean-Jacques Dubray
@jdubray
Jul 02 2016 18:57
@srconklin This sample is a bit old, but the general idea is true, you can take any HTML template and "break it down" in components that way. That's actually the recommended way. The separation between actions/model/state, should make it easier to write the code.
I recommend you take a look at the TODOMVC example: https://github.com/jdubray/sam-samples/tree/master/todomvc-app
There is also the "fishing game" that should give you a good example of how well it works: https://github.com/jdubray/sam-samples/tree/master/js-rectangle
The beauty of the pattern is that if you have a SAM instance on the client, it can still trigger actions running on the server (which could present data to the model) or maintain a model on the server that synchronizes with the client, or return a new "state" altogether for the client.
SAM is extremely flexible that way.
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:04

if so, why would I need to take the time to go through the exercise of creating all those granular functions for the html components if they don't change?

you obviously don't need too

I just like the idea of components because they can be maintained individually, and a new theme with the same interface be replace an old one
Scott Conklin
@srconklin
Jul 02 2016 19:18

@jdubray Thanks for all that input.. but the todo-app does not build funtions out of every piece of html all the way up the hierarchy to the head and html tags like the sbadmin example does.... so I guess my question is more of how much to parameterize vs how much to make static.. but perhaps I have just confused myself and I don't have a competent question:

> blockquote  There is no longer a notion of "page", you update the model in a way that is unknown from the view. The view then renders the current state of the model

I think I get this, but am trying to understand why I would ever need to build functions that paramertize the html head ; i.e. theme.head.
doing something like this would not work for the todo app, would it?
wouldn't you have a lot of content "flashing"

 return (theme.html(
                  theme.head(
                       theme.headerLinks(title) 
                  )
                + theme.body(
                                  view
                   )
);
sorry, got the blockquote markup syntax wrong
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:19
As I mentioned this is an old sample, I am not sure I would do it that way today
That being said, there is a number of JavaScript libraries that need to get mounted for the "page/SPA" to work and that's when you would still want to parameterized some aspects of it
All I wanted to show with that sample is that anyone could take an off-the-shelf template and do something (nice-looking) with it.
Scott Conklin
@srconklin
Jul 02 2016 19:22
@jdubray ok.I see..... But you are not saying that every time you would post a todo, the view would be something like this:
return (theme.html(
                  theme.head(
                       theme.headerLinks(title) 
                  )
                + theme.body(
                                  view
                   )
);
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:23
No, as I mentioned earlier, you can decide how much the browser / server implement.
SAM is particularly good at positioning API calls in the app logic
Read -> Actions
Create,Update,Delete -> Model
Scott Conklin
@srconklin
Jul 02 2016 19:23
@jdubray ok got it..
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:24
I am working on a new "big" sample using Angular2 and SB Admin theme to show a more realistic way to use SAM
with a back-end of course
Scott Conklin
@srconklin
Jul 02 2016 19:26
@jdubray ok, But out of curiosity why use Angular2 when you eschew its benefits so much.. why not Plain JS/HTML5/CSS which I think I gathered from your site you much prefer
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:27

The only reason I would use Angular2 is that one: https://angular.io/docs/ts/latest/guide/security.html

otherwise I do not see any reason

SAM factoring would allow some middleware to achieve the same result (input of actions and output of model)
But it would take some time for people to trust it
To be frank, both React and Angular2 have shot themselves in the foot the day the best "practice" was "stateless" component and a unidirectional data flow with a single state tree
that day their component model died and proved that in effect you need something a lot closer to what I am suggesting. You don't need a "component" model for that. React now has downgraded components to be ... pure functions.
But it will take some time before people decide to leave these Framework behind.
HTML5 / CSS3 are really powerful, the Frameworks tend to water down what you can achieve with them alone.
Scott Conklin
@srconklin
Jul 02 2016 19:40
@jdubray agreed.. and that is why I have come to SAM and this forum.... and am especially interested in what you had to say about using just JS/HTML5/CSS and leaving all frameworks behind including CSS ones like bootstrap and doing everything myself ... and hopefully still be able to build beautiful enterprise level web applications.
Jean-Jacques Dubray
@jdubray
Jul 02 2016 19:50
I am glad you are, I'd be happy to start working on some middleware (SAFE) to start addressing XSS issues. In general people get irritated when I speak about this topic, but I have not changed my position much. People tend to be in disbelief when I say you don't need a framework and don't take SAM seriously.
HTML5 templates are amazing and nothing like what you see coming out of React or Angular/2 apps
However, you cannot ignore XSS if you go the HTML5/CSS3 route