1

I am seeking a way to use/incorporate more modern tech to our front end stack at work.

Our pages always follow this flow:

landing -> shipping -> payment -> receipt

they are all php files and getting a product names and such from backend. for a frontend, it is very old school HTML/CSS( SASS )/jQuery stack.
Another thing to note is that we provide very similar design pages to different clients so parts of the page can be reused. For example, a payment form can be shared between 10 different projects with different color scheme/logo/verbiage. We use php include for sharable components for now.

I was wondering if there's any modern alternative to create our pages while meeting these requirements:

  • Need to be able to use in .php files
  • Light weight since page load speed is one of the most important factor in this industry
  • Has to follow the flow shown above
  • Can turn into components to be reused in different projects( component library using Vue or React? )

I'd like to go more modern way even if it's an overkill.

Thanks in advance for your advise!

Edit: by "modern tech", I mean something that's being talked about and gaining popularity as of 2019. This includes frameworks, preprocessor and such.

  • I love this question (and have made it a favourite), but someone is going to ask you to define "modern" :-/ – Mawg Jun 14 at 9:22
  • 1
    @Mawg Thanks! I'll edit my post to include my idea of modern. – Hoshki Tsunoda Jun 14 at 16:33
0

Mustache

Consider Mustache it is a templating system. It allows the back end to emit structured data (such as json), and the front end to convert it to html using a template. There is a little more work in the back-end, middle, but less in the front-end.

CSS

css can be used for the style, logos, etc. You can have two style sheets, one common, and another from a set (one for each client).

Conclution

If done well, you can separate: data storage (Database), data processing (output JSON), document structure (Mustache/HTML), style (CSS), layout (CSS).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.