Create layout for PHP and .Net applications

2

I work in a public body and we have numerous web applications in PHP and .Net .

I'm working on a standard layout so that we maintain the visual identity across all systems.

Is there any way (tool / framework / API) that every developer, regardless of language can use?

The structure we set up is: Header , PostCss , Navbar , Content , Sidebar , PostScript and Footer .

In PHP for example, I give include to the file and that's it. I can still customize some variables as $tituloPagina .

We would still like to create sections like Laravel in Blade , where I can use @yield and @section .

The idea was to create an API and in the URL, the programmer already passed the value of the variables and then mount the layout with the JSON of the result, or something like: ?tituloPagina=loremipsum&corpoPagina=centralizado .

    
asked by anonymous 29.01.2016 / 13:41

4 answers

3

The solution to this is more or less what is already in the question.

Of course the ideal is not to use various technologies, if you did, it would still be better to change all that. But it may be impracticable to change everything now. So you have to change at least a part.

Each technology will try to do the best possible within its philosophy, will not bother to work with others so disparate.

Single Page Application

Depending on the case, you can do the entire layout on the client, using SPA . There are several frameworks disputing the market (the status of popularity is my perception at the time of the answer, do not take as absolute info):

Web API

The other way is to let one of these technologies take care of layout and the other one to be used only as an API, as stated in the question. It does not have much secrecy, it does not need anything special.

.Net has something that makes it easy to use ASP.Net with WebAPI . The new version integrated this technology into ASP.Net Core.

I do not know of any universally accepted tool for PHP. But in the background is just a standardization of how the data should be accessed.

There are no tools that help standardize between different technologies. The most that can be done is to create your own standards, set up a library, and a feedback mechanism that you can use in both technologies. But I doubt the work will pay off. If it were something good to do, someone would have created something as a product.

If you have specific questions you need, ask specific questions.

    
29.01.2016 / 13:57
3

For what you describe, what you need is a template engine on the client side

In order to do so, use both servers (php and .net) only receiving the data of an API and yes, being able to customize

One of the most famous (I use) is Handlebars.js

    
01.02.2016 / 12:45
2

The current proposal is to use the "javascript template engine".

There are several frameworks like angular.js, handlebars.js, mustache.js, jquery template, pure.js, dust, js, emblem.js, marckup.js, plates.js, json2html, p>

The biggest difficulty you may have is when you need search engine compatibility.

Search bots do not compile JavaScript. One implication in this is, for example, when the website that loads the body of a page by ajax. Since the bot does not execute JavaScript, you will not even be able to make the requisitions, unless you make specific adaptations.

    
01.02.2016 / 13:19
1

It complements the response of @bignow , you need to put together a strategy and establish which standard of tools to use. You should ask yourself (and / or staff) questions about how to act, as there are currently many different ways of doing what you want. Public bodies generally do this very well, I say this because I have already implemented applications contained in SPB - Public Software Portal and several of them use a strategy of creating layouts aimed at standardization.

See a simple example, which refers to the idea raised by you. Using javascript technology, specifically the pure.js library.

<!DOCTYPE html>
<html>
<head>
  <title>PURE Unobtrusive Rendering Engine</title>
  <script src="http://pure.github.io/pure/libs/pure.js"></script>
</head>
<body>

   <!-- HTML template -->
  <ul>
    <li>
      <span></span>
    </li>
  </ul>

  <script>
    var data = {
      animals:[
        {name: 'mouse'},
        {name: 'cat'},
        {name: 'bird'},
        {name: 'dog'}
      ]
    };
    var directive = {
      'li':{
        'animal<-animals':{ //for each entry in animales name the element 'animal'
          'span': 'animal.name' //the dot selector, means the current node (here a LI)
        }
      }
    };
    $p( 'ul' ).render( data, directive );
  </script>
</body>
</html>
    
01.02.2016 / 14:06