Web Design and Development |OT| Pixel perfect is dead, long live responsive design

Nov 10, 2015
4,323
39
285
Hey guys, hoping someone can help me out. Im helping out superepicman. We're using a mean stack for our project, and while I know angular well, I'm new to node js and express. Hoping this project is a learning experience for me as I'm more of a dot net guy.

Anyway, the issue I'm having right now is that I can't kill my express server (we're running mongoose for our mongodb odm) after starting it if im calling it alongside a typescript transpile call. Making working on it tedious as hell.

Our package.json script is the following:

Code:
server: "tsc -p tsconfig-server.json && node bin/server/server.js"
If I enter npm run server, everything works as expected. Typescript compiles, server starts listening, BUT if I hit ctrl + c the server keeps on running in the background. It still answers requests, and if I try to run npm run server again I get the expected, port is already in use error. I have to then go to task manager and kill all node.js processes to restart.

The weird thing is that if I instead type both commands separately, first tsc -p tsconfig-server.json and THEN node bin/server/server.js, ctrl + c works in killing the server properly. This weird behavior is killing my mojo!

I'm on windows 10 running these commands on a gitbash command prompt. This is also a more simplified setup after noticing this issue, as I had everything setup to watch for ts file changes for reloading the node server app while developing.

Any help would be appreciated. Can also share our repo address if need be. On mobile right now so will add tomorrow.
 
Jan 22, 2010
7,872
0
680
I'm starting a fairly large project and was wondering about one thing.

Is it better to separate all the string contained in the website that would otherwise be static to its own separate file? Something like how Android apps do it by separating all the strings from an app in a separate file (I believe in an xml file) and then feeding it by binding data to the template.

Like an example I'm thinking of is a "Made by John Doe" would be separated into something like:

Code:
state: {
  madeBy: {
    en: 'Made by',
    fr: 'Faite par',
  },
},
then feeding it into the template like

Code:
<p> {{ madeBy.en + ' ' + authorName }}</p>
This is a very rough idea of what I'm thinking of. Is this a thing already in the front-end world? I'm thinking it'd be good later when I need to add French or other languages in the near future but I'm worrying that it'll make the website slower than it should. I'm going to be using VueJS and Vuex
 
Aug 9, 2006
19,682
0
0
I'm starting a fairly large project and was wondering about one thing.

Is it better to separate all the string contained in the website that would otherwise be static to its own separate file? Something like how Android apps do it by separating all the strings from an app in a separate file (I believe in an xml file) and then feeding it by binding data to the template.

Like an example I'm thinking of is a "Made by John Doe" would be separated into something like:

Code:
state: {
  madeBy: {
    en: 'Made by',
    fr: 'Faite par',
  },
},
then feeding it into the template like

Code:
<p> {{ madeBy.en + ' ' + authorName }}</p>
This is a very rough idea of what I'm thinking of. Is this a thing already in the front-end world? I'm thinking it'd be good later when I need to add French or other languages in the near future but I'm worrying that it'll make the website slower than it should. I'm going to be using VueJS and Vuex
It's a common strategy but you do run the risk of having excessive FOUC (Flash of unstyled content) if a resource is held up. The most performant way would be to precompile different language versions of the app templates and use the http language header to serve them appropriately (and perhaps a user setting to override).
 
Nov 26, 2014
1,896
0
270
I'm starting a fairly large project and was wondering about one thing.

Is it better to separate all the string contained in the website that would otherwise be static to its own separate file? Something like how Android apps do it by separating all the strings from an app in a separate file (I believe in an xml file) and then feeding it by binding data to the template.

Like an example I'm thinking of is a "Made by John Doe" would be separated into something like:

Code:
state: {
  madeBy: {
    en: 'Made by',
    fr: 'Faite par',
  },
},
then feeding it into the template like

Code:
<p> {{ madeBy.en + ' ' + authorName }}</p>
This is a very rough idea of what I'm thinking of. Is this a thing already in the front-end world? I'm thinking it'd be good later when I need to add French or other languages in the near future but I'm worrying that it'll make the website slower than it should. I'm going to be using VueJS and Vuex
I use counterpart for most of my client side i18n work.

https://www.npmjs.com/package/counterpart

you can throw it into everything, it does not matter which framework/library you use to build the app.


If you use webpack it's really easy to load the translations currently needed with dynamic imports.
 
Jan 22, 2010
7,872
0
680
It's a common strategy but you do run the risk of having excessive FOUC (Flash of unstyled content) if a resource is held up. The most performant way would be to precompile different language versions of the app templates and use the http language header to serve them appropriately (and perhaps a user setting to override).
I use counterpart for most of my client side i18n work.

https://www.npmjs.com/package/counterpart

you can throw it into everything, it does not matter which framework/library you use to build the app.


If you use webpack it's really easy to load the translations currently needed with dynamic imports.
Thanks for the info! I'll definitely take a look at those options. What's are good resources for VueJS? Like best practices and whatnot.
 
Jan 7, 2015
141
0
0
Has anyone taken this Web Developer Bootcamp from Udemy? The course is on sale and I'm on a fence whenever to get it or not. https://www.udemy.com/the-web-developer-bootcamp/
I did and thought it was nice... However, I do have one problem with these types of tutorial/walkthrough/courses. This is more of a personal problem, but i'm sure other people might be like this as well.

I thought I was understanding what he was talking about when going through the course. But guess what? I never once thought what to do for myself. I never once thought how to break any of the problems down and solve them/create them for myself. The course will hold your hand every second of the way, and now that I look back, I really dislike that it does that. If you can take a step back and try to solve things yourself, before he actually does it and shows you, I think it'd be a pretty decent course.
 
Nov 21, 2011
3,662
0
0
I am currently working Bootstrap 4 and I am having a bit of trouble with setting up the nav bar. Basically I have something like this:

Website Title - Search Bar - Button 1 - Button 2

At the moment everything is aligned on the left, but I am wanting to float the 2 buttons to the right and nothing seems to be working.

My code is currently:

Code:
<nav class="navbar navbar-expand-md navbar-light bg-light">
	<div class="container">
	  <a class="navbar-brand" href="#">Website Title</a>
	  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
	    <span class="navbar-toggler-icon"></span>
	  </button>
	  <div class="collapse navbar-collapse" id="navbarSupportedContent">
	    <form class="form-inline">
	    	<span class="icon search-icon"><i class="fa fa-search"></i></span>
		    <input class="search-bar form-control mr-sm-2" type="text" placeholder="Search bar" aria-label="Search">
		  </form>
			<button class="btn rounded-btn"><i class="fa fa-home" aria-hidden="true"></i> Button 1</button>
		  <button class="btn rounded-btn"><i class="fa fa-plus" aria-hidden="true"></i> Button 2</button>
	  </div><!-- /.collapse /.navbar-collapse -->
  </div><!-- /.container -->
</nav><!-- /.navbar -->
 
Jun 26, 2012
3,190
0
0
I am currently working Bootstrap 4 and I am having a bit of trouble with setting up the nav bar. Basically I have something like this:

Website Title - Search Bar - Button 1 - Button 2

At the moment everything is aligned on the left, but I am wanting to float the 2 buttons to the right and nothing seems to be working.
The easiest way to do it is to put an auto margin on one side of the content you want to align. Bootstrap 4 has some helper classes for this, so in your case you either add 'mr-auto' to your form element, or 'ml-auto' to your 'Button 1' element. Though if you go the latter route, you should probably wrap your buttons in a div and put the 'ml-auto' on that instead.
 
Nov 10, 2015
4,323
39
285
I am currently working Bootstrap 4 and I am having a bit of trouble with setting up the nav bar. Basically I have something like this:

Website Title - Search Bar - Button 1 - Button 2

At the moment everything is aligned on the left, but I am wanting to float the 2 buttons to the right and nothing seems to be working.

My code is currently:

<nav class="navbar navbar-expand-md navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">Website Title</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<form class="form-inline">
<span class="icon search-icon"><i class="fa fa-search"></i></span>
<input class="search-bar form-control mr-sm-2" type="text" placeholder="Search bar" aria-label="Search">
</form>
<button class="btn rounded-btn"><i class="fa fa-home" aria-hidden="true"></i> Button 1</button>
<button class="btn rounded-btn"><i class="fa fa-plus" aria-hidden="true"></i> Button 2</button>
</div><!-- /.collapse /.navbar-collapse -->
</div><!-- /.container -->
</nav><!-- /.navbar -->
Not a CSS guru, but isn't flex great for this? display: flex; flex-direction: row; on the container, then include a span between your content and the buttons with flex-grow: 1;
 
Nov 21, 2011
3,662
0
0
The easiest way to do it is to put an auto margin on one side of the content you want to align. Bootstrap 4 has some helper classes for this, so in your case you either add 'mr-auto' to your form element, or 'ml-auto' to your 'Button 1' element. Though if you go the latter route, you should probably wrap your buttons in a div and put the 'ml-auto' on that instead.
Giving my form the mr-auto class worked great, thanks.

Not a CSS guru, but isn't flex great for this? display: flex; flex-direction: row; on the container, then include a span between your content and the buttons with flex-grow: 1;
I'm still pretty new to flex box, so I haven't had much experience with using it.
 
Aug 11, 2016
273
0
0
I am looking for some advice on getting back into the freelancing game once more. I am currently doing boring ass backend system admin work and want to get back into doing more front-end even full stack freelancing gigs (I like creating shit not just maintain servers =/). The problem is I haven't done this in almost 5 years so I am a bit rusty and need to find some easy projects to start with to get into the the client/freelancer routine. Where do most new freelancers start looking for work nowadays? I did the craigslist thing way back when it had some legit work but looking at it now it seems to be full of barter type contract work.
 
Dec 6, 2008
1,393
0
680
Hey guys, really need your input here. So I'm a bit overwhelmed about how much catchup I need to do to be viable again. I'm looking to learn Laravel, AngularJS, Restful APIs (whatever the hell those are) as well as LESS/SASS. Most of the job postings I'm looking at seem to require all those things. Not sure which one to prioritize learning though. Basically I've been out of a job for 3 months now and I need to get back in the game the fastest way possible. Which of those things can I learn the fastest that will help me get a job?

I've been left behind skills wise because all I've been doing was create and modify WP themes for the past 3 years, and couldn't find the time to keep myself up to date.

HALP!
 

Tathanen

Get Inside Her!
Aug 17, 2005
9,601
0
0
36
www.n-sider.com
Hey guys, really need your input here. So I'm a bit overwhelmed about how much catchup I need to do to be viable again. I'm looking to learn Laravel, AngularJS, Restful APIs (whatever the hell those are) as well as LESS/SASS. Most of the job postings I'm looking at seem to require all those things. Not sure which one to prioritize learning though. Basically I've been out of a job for 3 months now and I need to get back in the game the fastest way possible. Which of those things can I learn the fastest that will help me get a job?

I've been left behind skills wise because all I've been doing was create and modify WP themes for the past 3 years, and couldn't find the time to keep myself up to date.

HALP!
Start by understanding how to interact with a RESTful API, and why they are the way they are. Then Angular, 1 or 2/4 depending on what jobs look like they're requesting. Or React, depending on your market, Chicago for example is all about React these days.

Those will be the most vital for most of what you'll end up doing. LESS/SASS aren't really different enough from CSS to prioritize, they'll be easy to pick up later. Laravel honestly I've never heard of.
 
Feb 10, 2015
6,554
0
0
Does anyone have any good resources for dealing with images and responsive design? I mentioned this a couple of months ago but I feel like when I develop a website I always feel shaky about sizing images, including what to set their widths and heights to in CSS versus the actual dimensions of the image.

Basically I suck at images but want to read about the right way to handle them.
 
Dec 6, 2008
1,393
0
680
Does anyone have any good resources for dealing with images and responsive design? I mentioned this a couple of months ago but I feel like when I develop a website I always feel shaky about sizing images, including what to set their widths and heights to in CSS versus the actual dimensions of the image.

Basically I suck at images but want to read about the right way to handle them.
Why not just set the width at a percentage then set the height to auto so it doesn't look stretched? Say:

Code:
img {
width:80%;
height:auto;
}
 
Feb 10, 2015
6,554
0
0
Why not just set the width at a percentage then set the height to auto so it doesn't look stretched? Say:

Code:
img {
width:80%;
height:auto;
}
First, you should use different images for different screen sizes. There is no need to use a 2560px image on phones.
The way to go would be srcset here.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img


For sizing make sure you don't mess up the aspect ratio with some fixed width/heights.. Browsers are pretty good at scaling images these days, so you should be fine.
I'll keep this in mind and come back with specific questions if any appear as I start to make a portfolio website for someone. Thanks.
 
Does anyone have any good resources for dealing with images and responsive design? I mentioned this a couple of months ago but I feel like when I develop a website I always feel shaky about sizing images, including what to set their widths and heights to in CSS versus the actual dimensions of the image.

Basically I suck at images but want to read about the right way to handle them.
On the sites I do at work, we have

img {
max-width: 100%
}

on the default style sheet, which covers a lot of basis for clients sticking their own content in and not really caring about responsiveness.
 
Jun 17, 2011
4,252
0
0
Rome, Italy
Fun times ahead!

https://ma.tt/2017/09/on-react-and-wordpress/

I've never thought of asking opinions, but since there are both WP and JS developers here, it might make sense, and it might be better than just scrolling through Hacker News or WP Tavern. :)

I've always noticed a lot of anger against React, even before the whole license hell broke loose.
Most people advocates for Vue with the only reason that it's easier to pick up - which I don't think should be the primary reason to choose a framework.

I mean, yes, WP and its soft learning curve have always been the reason lots of people got into PHP.
At the same time, I picked up React/Redux really, really quickly.
When I jumped from PHP to "non-jQuery" JS, I started with Angular and then jumped on React only a bunch of months later. In other words, I went from almost-zero JS to super complicated stuff in less than 2 years.
But, WP developers don't really need to know that much about React, just as they don't need to know everything about PHP.
Small stuff is really easy to do in React, and the boilerplate isn't that much, even with Redux. Probably the hardest part is setting up the whole dev environment, but there are pre-made bundles that make it all quick and relatively painless.

I don't know, I'll miss React going forward, especially because I don't think there are better alternatives right now.

(Full disclosure: I work at Automattic, specifically on Calypso, so I'm more than involved with this news :D )
 
May 20, 2011
1,522
0
0
The Netherlands
Fun times ahead!

https://ma.tt/2017/09/on-react-and-wordpress/

I've never thought of asking opinions, but since there are both WP and JS developers here, it might make sense, and it might be better than just scrolling through Hacker News or WP Tavern. :)

I've always noticed a lot of anger against React, even before the whole license hell broke loose.
Most people advocates for Vue with the only reason that it's easier to pick up - which I don't think should be the primary reason to choose a framework.

I mean, yes, WP and its soft learning curve have always been the reason lots of people got into PHP.
At the same time, I picked up React/Redux really, really quickly.
When I jumped from PHP to "non-jQuery" JS, I started with Angular and then jumped on React only a bunch of months later. In other words, I went from almost-zero JS to super complicated stuff in less than 2 years.
But, WP developers don't really need to know that much about React, just as they don't need to know everything about PHP.
Small stuff is really easy to do in React, and the boilerplate isn't that much, even with Redux. Probably the hardest part is setting up the whole dev environment, but there are pre-made bundles that make it all quick and relatively painless.

I don't know, I'll miss React going forward, especially because I don't think there are better alternatives right now.

(Full disclosure: I work at Automattic, specifically on Calypso, so I'm more than involved with this news :D )
I love React but the patent thing is the worst thing about it. Not that I personally care, I don't want to sue or be sued ever. But it's bad because of how many others do care and it is seriously limiting Reacts growth.

From that link tho, "Preact is definitely one that’s being considered." If Facebook does indeed have patents for React technology it's quite likely Preact would infringe upon them, and Preact doesn't grant you the use of Facebook patents so wouldn't this set you up to fail? (Not a lawyer obviously)

Good luck on your rewrite in Vue tho
 

D4Danger

Unconfirmed Member
Dec 5, 2008
25,310
0
0
do they actually have any React patents Preact and others could infringe though? I thought this was just a standard license included in all facebook software. More of a "just in case" type deal than an actual patent claim like say Microsoft would do.

Also surprised they dug in when Apache blacklisted them. I guess it will probably just start to die off now like a million js libs that have come before it if they can't get developer support.
 
Hey guys, really need your input here. So I'm a bit overwhelmed about how much catchup I need to do to be viable again. I'm looking to learn Laravel, AngularJS, Restful APIs (whatever the hell those are) as well as LESS/SASS. Most of the job postings I'm looking at seem to require all those things. Not sure which one to prioritize learning though. Basically I've been out of a job for 3 months now and I need to get back in the game the fastest way possible. Which of those things can I learn the fastest that will help me get a job?

I've been left behind skills wise because all I've been doing was create and modify WP themes for the past 3 years, and couldn't find the time to keep myself up to date.

HALP!
Not sure what your status is right now, but here's my input. Two of those technologies&#8212;Laravel and AngularJS&#8212;are both frameworks, so you'd actually need to learn the fundamentals of PHP and JavaScript first, respectively. Laracasts is an excellent resource for PHP and Laravel, whereas Code School has helped me a lot with AngularJS. For RESTful APIs, you can actually use Laravel to build said APIs, and use AngularJS to consume them as well. As for LESS or SASS, you don't need to learn them actively, since they're just extensions to CSS; most likely you'll be able learn them on the job with no problem.
 
Dec 6, 2008
1,393
0
680
Not sure what your status is right now, but here's my input. Two of those technologies—Laravel and AngularJS—are both frameworks, so you'd actually need to learn the fundamentals of PHP and JavaScript first, respectively. Laracasts is an excellent resource for PHP and Laravel, whereas Code School has helped me a lot with AngularJS. For RESTful APIs, you can actually use Laravel to build said APIs, and use AngularJS to consume them as well. As for LESS or SASS, you don't need to learn them actively, since they're just extensions to CSS; most likely you'll be able learn them on the job with no problem.
I'm pretty good with PHP, not so much with JS. Thanks for the reply.
 
Jun 17, 2011
4,252
0
0
Rome, Italy
Good luck on your rewrite in Vue tho
I see what you did there!


(Not a lawyer, probably going to say dumb things)
So the thing about Preact's possible overlaps with FB license is something that supposedly we're looking into.

Of course if it's liable of being screwed by FB, then it's a no-no as big as React itself.

To be fair though, even Vue or other frameworks might use something licensed by FB (the virtual DOM?)
This is a totally screwed up situation. :(

---

As an aside, the community is really making me hate Vue.
I'm kinda tired of reading countless "Vue +1" comments dropped without any explanations :'(
 
Nov 24, 2013
529
0
0
Hey guys I am just getting into Angular 1.5 and I am super confused about components and how to break them apart I basically have 2 components, 1st one is used with Angular 1.5's $http request to populate the controller's var called tickets with data. That part works.

I made a second component (a child component) which requires the parent component and will get the populated list ( the "tickets" var )from it and display it on the screen through ng-repeat.

The problem is that everytime I try to console.log() the array of tickets from the parent component in the child, I get a blank array.

But if I console.log(this.refToParent) --> I can see the array ("tickets") successfully populated
and if I console.log(this) (in the child component controller) --> Again I can see "ticktets" var successfully populated in object.

HOWEVER, if I do
console.log(this.refToParent.tickets) --> I get [ ] EMPTY
or
console.log(this.tickets) --> I get [ ] EMPTY

Pics here,
what am I doing wrong? I have been trying this for 3 days and Im on my wits end, I really don't think angular is that difficult to understand but this has my blood boiling

https://stackoverflow.com/questions/46283817/angular-1-5-js-access-variable-from-parent-component-in-child-component
 
Jun 19, 2013
10,866
1
470
UK
Can anyone offer any advice on the below WordPress debug log, my understanding from the end user is this supposedly worked up until a day or so ago....

Code:
[20-Sep-2017 19:58:14 UTC] WordPress database error You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '%1$s as CT_Orders

						INNER JOIN %2$s as tour ON CT_Orders.post_id=tour.ID

	' at line 1 for query SELECT CT_Orders.*, tour.ID as post_id, tour.post_title as tour_name FROM %1$s as CT_Orders

						INNER JOIN %2$s as tour ON CT_Orders.post_id=tour.ID

						WHERE 1=1 AND CT_Orders.post_type='tour' ORDER BY %3$s %4$s

						LIMIT %5$s, %6$s made by require_once('C:\xampp\htdocs\dayoutbycoach.co.uk\wp-admin\admin.php'), do_action('tour_page_tour_orders'), WP_Hook->do_action, WP_Hook->apply_filters, call_user_func_array, ct_tour_order_render_pages, ct_tour_order_render_list_page, CT_Tour_Order_List_Table->prepare_items
I'm not exactly what is wrong there to cause an error all of a sudden, but nothing on the server or files wise with the site has changed.
 
Apr 15, 2010
25,095
1
0
Can anyone offer any advice on the below WordPress debug log, my understanding from the end user is this supposedly worked up until a day or so ago....

Code:
[20-Sep-2017 19:58:14 UTC] WordPress database error You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '%1$s as CT_Orders

						INNER JOIN %2$s as tour ON CT_Orders.post_id=tour.ID

	' at line 1 for query SELECT CT_Orders.*, tour.ID as post_id, tour.post_title as tour_name FROM %1$s as CT_Orders

						INNER JOIN %2$s as tour ON CT_Orders.post_id=tour.ID

						WHERE 1=1 AND CT_Orders.post_type='tour' ORDER BY %3$s %4$s

						LIMIT %5$s, %6$s made by require_once('C:\xampp\htdocs\dayoutbycoach.co.uk\wp-admin\admin.php'), do_action('tour_page_tour_orders'), WP_Hook->do_action, WP_Hook->apply_filters, call_user_func_array, ct_tour_order_render_pages, ct_tour_order_render_list_page, CT_Tour_Order_List_Table->prepare_items
I'm not exactly what is wrong there to cause an error all of a sudden, but nothing on the server or files wise with the site has changed.
WordPress just pushed 4.7.x for some security updates, and one of the plugins you use could rely on a database update to MySQL, or the reverse, MySQL updated on your host and a plugin might be using an old version.

I'd be surprised that MySQL syntax errors would appear suddenly, so I'd check for any recently updated plugins. If you're using a cart or order plugin to handle ordering or shopping cart or something ("CT_ORDERS") check to see if that plugin updated or if it needs an update.

%1$s as CT_orders probably comes from a 'walker' function in WordPress, which is the syntax for how WP steps through items as part of a function... You most commonly run into that syntax with walkers like the nav_walker, which you'd run into editing your navigation format. I'm surprised that the MySQL error is displaying '%2$s' which is typically WP's reference to an item in a walker, where I'd imagine MySQL would be getting the actual item or column name, not '%2$s' or '%4$s' which is what it's getting.

But for the error to pop up *now* probably indicates that:
1) Plugin out of date or recently updated, check whatever your'e using for orders or tours on your site
2) WP recently updated or out of date w/ plugins
3) Your host could have upgraded/modify the version of MySQL that you have running, but I sort of doubt that... they'd normally send at least an update to customers if that was the case
4) Your host could have upgraded PHP or some other dependency, likewise they'd probably send you some sort of email or notification about that

For a SQL error, the website looks like it's running... I plugged in the URL from that error and it looks to be up, although maybe it's erroring out on the Admin dashboard. Also sort of surprising that your host or whoever is using windows to host...

C:\xampp\htdocs\[your site URL is here in the logs]\wp-admin\admin.php

Need help coding a certain part. In this image at the bottom blue are where it says "franchise qualification process". how would I got about coding that part?
What way are you having trouble with it? Getting the list to appear in two columns? If so, there's a relatively new CSS declaration called 'columns' which is pretty awesome:

https://developer.mozilla.org/en-US/docs/Web/CSS/columns

It's got pretty broad support in all major browsers but old IE might have trouble with it.
 
Jun 19, 2013
10,866
1
470
UK
WordPress just pushed 4.7.x for some security updates, and one of the plugins you use could rely on a database update to MySQL, or the reverse, MySQL updated on your host and a plugin might be using an old version.

I'd be surprised that MySQL syntax errors would appear suddenly, so I'd check for any recently updated plugins. If you're using a cart or order plugin to handle ordering or shopping cart or something ("CT_ORDERS") check to see if that plugin updated or if it needs an update.

%1$s as CT_orders probably comes from a 'walker' function in WordPress, which is the syntax for how WP steps through items as part of a function... You most commonly run into that syntax with walkers like the nav_walker, which you'd run into editing your navigation format. I'm surprised that the MySQL error is displaying '%2$s' which is typically WP's reference to an item in a walker, where I'd imagine MySQL would be getting the actual item or column name, not '%2$s' or '%4$s' which is what it's getting.

But for the error to pop up *now* probably indicates that:
1) Plugin out of date or recently updated, check whatever your'e using for orders or tours on your site
2) WP recently updated or out of date w/ plugins
3) Your host could have upgraded/modify the version of MySQL that you have running, but I sort of doubt that... they'd normally send at least an update to customers if that was the case
4) Your host could have upgraded PHP or some other dependency, likewise they'd probably send you some sort of email or notification about that

For a SQL error, the website looks like it's running... I plugged in the URL from that error and it looks to be up, although maybe it's erroring out on the Admin dashboard. Also sort of surprising that your host or whoever is using windows to host...

C:\xampp\htdocs\[your site URL is here in the logs]\wp-admin\admin.php

Awesome, I will go through and check everything, that's what threw me out with it supposedly stopping working on Tuesday, the error is indeed only in the admin area, and the windows error you see there is our development site, as after tracking down changes and what might have been changed I tested the above in our development area (which is where I grabbed the error from instead of the live site as that was my active window from many remote windows on my laptop) and got the exact same error, and funnily enough this development area hasn't been changed or anything since mid July.

WordPress was running an old version prior to this (4.7.5) and I updated to 4.8.2 and still got the same error, I then upgraded all plugins and the theme but the error still persisted, it was when I got an error on the dev site I ruled out any server changes and spent time debugging WordPress itself.

So whilst the end user says things were working fine, I am not 100% convinced.
 
Oct 27, 2012
382
0
0
Can finally stop hearing about this

"We're relicensing React, Jest, Flow, and Immutable.js under the MIT license."

https://twitter.com/reactjs/status/911347634069168128
Hopefully this doesn't cause WordPress to do an about face on React; there's no guarantee they won't switch the license again in the future.

I was just starting to get excited about not having to touch React ever again too. I have no desire to rewrite the UI of a highly popular WP plugin with it.
 
Dec 6, 2008
1,393
0
680
Hopefully this doesn't cause WordPress to do an about face on React; there's no guarantee they won't switch the license again in the future.

I was just starting to get excited about not having to touch React ever again too. I have no desire to rewrite the UI of a highly popular WP plugin with it.
What's wrong with React? Is it a pain to use, or just in relation to WP?
 
Oct 27, 2012
382
0
0
What's wrong with React? Is it a pain to use, or just in relation to WP?
I find it to be a pain to use.

I tend to be able to pick up new technologies/frameworks pretty quickly. I bought and followed the "React for Beginners" course and then went to work creating a simple five page form with React for a work project. It was nothing but frustration, running into headaches as to why certain things wouldn't work as documented or why data wasn't passing around as it should. It took me a while to get through something that should have been relatively simple.

A few weeks later, I decided to give Vue a try and was able to rewrite the whole thing in an afternoon with ease. I could get interfaces up and running within minutes without having to deal with JSX, just using standard HTML.

Working with Vue is without question the most enjoyment I've ever had using Javascript. It gets the pain points of handling the DOM out of the way, allowing you to build awesome apps. It's all I use for complex Javascript projects now.

The way it's easy to get started and building real interfaces with Vue is why I'm a big proponent of its use in WordPress. Making the code easy to get into is part of what made WordPress as popular as it is today.

I tend to hear a lot that it doesn't matter what JS framework core goes with as plugin and theme developers can use whatever they want, but how often do you see those plugin and theme developers use technologies outside of what's bundled with WordPress?
 
Nov 26, 2014
1,896
0
270
React with Redux and Redux Saga is a part of me now, hard to use something else. It's always like this with frameworks of that size. You can't master them all, way too complex.
 
Jun 17, 2011
4,252
0
0
Rome, Italy
I tend to hear a lot that it doesn't matter what JS framework core goes with as plugin and theme developers can use whatever they want, but how often do you see those plugin and theme developers use technologies outside of what's bundled with WordPress?
That's pretty much our default defence. :D
Although, when it comes to JS framework inside the WP core, well, there's Backbone in there, and it's not like WP devs everywhere in the world ever jumped on the Backbone bandwagon.

As far as I know, Gutenberg will expose some kind of API that should make it easy for plugins devs to add stuff to the editor without having to deal with whatever framework they'll decide to use.

---

This said, I jumped from Angular 1 to React and I immediately loved it.
Yes, it took me A LOT to get Redux right (and even now I'm still grateful that all the middlewares in WP Calypso are handled by some crazy good colleague and not by me), but yeah, as grmlin said, it has become a second nature for me - something that never happened to me in 10+ years of development.

Though, seeing how much Vue is pushed by the community, I'm kinda interested in knowing more about it.

For example, why do people always says that it has a steeper learning curve?
React in itself is absurdly easy. The Component class has literally a dozen of functions, and you can live even by not knowing some of them! :D

I know that Redux is really hard.
And I know that JSX, ES6+, and Webpack, and Babel, and other stuff that's usually pushed as part of React can complicate things.
But React per se is really super duper easy!



and JSX is actually much neater than mustache templates :3
 
Jun 19, 2013
10,866
1
470
UK
Which framework out of Ember, React, Angular or Meteor?

I am growing restless at my current place which is stuck in the past, but looking at other positions they want a wide range of frameworks like the above, as well as Laravel or CodeIgnitor, again neither of which I have experience because the place I am not now is lacking in these areas.

So what would you guys recommend?
 
Nov 26, 2014
1,896
0
270
The Angular guy will say Angular, React guy React etc. pp.

Meteor is a completely different beast, as it's a solution for both frontend and backend. I loved it back when it was fresh, but never really sticked to it.

We use Laravel with React+Redux, and we love it. You should try them all, and, most important, you forgot the new star, Vue, in your list ;)
 
Jun 19, 2013
10,866
1
470
UK
It all just seems like a minefield when you want to take the next step from coding in PHP/MySQL to a framework.

Problem is being the only person here I have no one who has experience in frameworks when I should use them, does that make sense?

Our primary thing we do is just straight forward websites for schools and clients, I don't want to fal linto a trap of just using them for the sake of using them. There's also the time pressures of my boss and delivering a project within his timescales.
 

GHG

Member
Nov 9, 2006
15,836
1
1,065
It all just seems like a minefield when you want to take the next step from coding in PHP/MySQL to a framework.

Problem is being the only person here I have no one who has experience in frameworks when I should use them, does that make sense?

Our primary thing we do is just straight forward websites for schools and clients, I don't want to fal linto a trap of just using them for the sake of using them. There's also the time pressures of my boss and delivering a project within his timescales.
A personal project on the side is the way to go in this situation. Think up something you want to make, select a framework and just get to it. It can be a random utility app or something that you think you'd get personal use out of. For example the first app I built using Meteor was a photo sharing app just for me and my wife to be able to share high quality photos privately over the Internet (I don't have a Facebook and whatsapp compresses images to hell and back).

The key thing to understand with frameworks is that they are not all equal and certain ones do certain things better. As long as you select a modern framework that does what you want it to and it's still being supported you can't go wrong really.