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

Nov 26, 2014
1,896
0
270
We don't use React or Angular for "normal" websites. That's imho not worth the work. It's so much more complex and often means a lot of work if you try to use it with classic CMSs like Drupal or something.
 
Jun 19, 2013
10,866
1
470
UK
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.
I was thinking of rebuilding an age old booking system built in PHP with a lot of excess code in a modern framework as a project.

We don't use React or Angular for "normal" websites. That's imho not worth the work. It's so much more complex and often means a lot of work if you try to use it with classic CMSs like Drupal or something.
You see that's exactly what I thought.
 

Ikuu

Had his dog run over by Blizzard's CEO
Mar 7, 2007
14,998
0
0
It doesn't really matter which you pick, it's all about learning the principles and the benefits they bring. For me anything that involves more interactive and complex components you'll want to look into using a framework.
 
Jan 5, 2010
1,773
0
0
We don't use React or Angular for "normal" websites. That's imho not worth the work. It's so much more complex and often means a lot of work if you try to use it with classic CMSs like Drupal or something.
Ding ding ding, that's an important concept right here. Lots and lots of publicly-available website do not require cutting-edge front-end frameworks. I wish agencies around here understood that, I know many of them that are only selling blog-like websites, editorial or marketing stuff, but want to hire front-end engineers because of the buzzwords. If they got one they wouldn't know what to do with them.
 
Jun 19, 2013
10,866
1
470
UK
It doesn't really matter which you pick, it's all about learning the principles and the benefits they bring. For me anything that involves more interactive and complex components you'll want to look into using a framework.
Noted.

Ding ding ding, that's an important concept right here. Lots and lots of publicly-available website do not require cutting-edge front-end frameworks. I wish agencies around here understood that, I know many of them that are only selling blog-like websites, editorial or marketing stuff, but want to hire front-end engineers because of the buzzwords. If they got one they wouldn't know what to do with them.
This is something that seems prevalent around here too!
 
Nov 26, 2014
1,896
0
270
I use a pretty simple web components library (that I actually created exactly for these type of pages). They work with completely server side generated HTML while enhancing the page with fancy js I can write in a more or less modern way.

The world of real client side single page applications is pretty rough. You'll need experienced developers for it. I saw many projects suffer a lot by newcomers jumping on a hype train.
 
Apr 15, 2010
25,095
1
0
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 ;)
Meteor has some really neat functionality extendable from the Meteor community, but like you I started with Meteor and then never really picked it up for a real project. Meteor always felt like a solution in search of a problem, to me. Like, for any videos on getting started with Meteor, in the "Benefits of Meteor" section of every beginner video, I've never felt like what those are problems I run into in my app.

How it natively used local data stores was really cool, though, it's just always been sort of like a parlour trick for me... Like "Oh you can unplug the internet and your app still works, and then when you plug it in it picks right back up!" Like, that's neat but ... I've never had that as a requirement for a real project.
 
Nov 24, 2013
529
0
0
Guys I have a problem with bootstrap, I want to make a sticky navbar (which bootstrap has many ways of doing) but not one that is the width of the window, but one that is the width of a parent container. (See image for mockup)

Code:
[IMG]https://i.imgur.com/44Pe0Tm.jpg[/IMG]
I have been trying this for a couple days to no avail, I was trying not to use JS/jQuery to solve this problem but it seems inevitable...

--> I tried placing the nav markup within the container for the right side, (with class navbar-fixed-top) but the width just took up the whole window.

--> Then with the nav markup still in the container I changed the
parent position:relative and the nav position:absolute.
After that the width of the nav matched the parent container but it did not still even with the navbar-fixed-top class.

--> Possible solution: Use Jquery to query the right side columns to get width, set fixed navbar with same width. (But I feel like this cannot be done with out JS)

Heres the boilerplate

Code:
<div class="container">
    <div class="row page">
      <div class="col-sm-6 col-sm-push-6">
       <nav class=" nav navbar-default navbar-fixed-top" >
        <div class="container-fluid ">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle menubtn" data-toggle="collapse" data-target="#top_bar">
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
          </div>
          <div class="collapse navbar-collapse" id="top_bar">
            <ul class="nav navbar-nav slideDown">
              <li class="nav-item my_list_item"><a href="#">Contact</a></li>
              <li class="nav-item my_list_item"><a href="#">Pricing</a></li>
              <li class="nav-item my_list_item"><a href="#">Sign in</a></li>
              <li class="nav-item my_list_item"><a class="get_started"href="#">Test</a></li>
            </ul>
          </div>
        </div>
      </nav>

      <div> SOME CONTENT</div>
     

      <div class="col-sm-6 col-sm-pull-6 passwordFig">
       <div>Some Content</div>
      </div>
    </div><!-- End of row -->
  </div> <!-- End of container -->
 
Jul 13, 2007
21,470
0
0
Finland
Guys I have a problem with bootstrap, I want to make a sticky navbar (which bootstrap has many ways of doing) but not one that is the width of the window, but one that is the width of a parent container. (See image for mockup)
Instead of using the Bootstrap's class, you can just set `position: fixed` to the nav element and add margin-top for the content so the navbar doesn't hide the content in the column.
 
Feb 20, 2014
5,343
0
0
hey guys i'm having trouble using the AWS elastic beanstalk cli on windows, i think i need to set up the environmental variable for it but i can't find a good answer for what i should put in there anywhere
 
Apr 25, 2009
4,376
0
0
Am playing around with SVG's and animation. Anyone can help me find the cause on why an SVG SMIL is taking much CPU cycles in Chrome?

Will PM an example if someone is willing to look at it.
 
Jul 13, 2007
21,470
0
0
Finland
hey guys i'm having trouble using the AWS elastic beanstalk cli on windows, i think i need to set up the environmental variable for it but i can't find a good answer for what i should put in there anywhere
You can see the variables here:

http://docs.aws.amazon.com/cli/latest/userguide/cli-chap-getting-started.html

basically you'll either need ACCESS_KEY_ID and SECRET_ACCESS_KEY, or `C:/Users/<your_name>/.aws/credentials` file and `AWS_PROFILE` env variable, where credentials-file looks like

Code:
[default]
aws_access_key_id=foobarbiz
aws_secret_access_key=bizbosbuz
region=us_west_1

[your-aws-beanstalk-thing]
aws_access_key_id=dingdong
aws_secret_access_key=pingpong
region=us_west_1
where you can select the profile with `AWS_PROFILE=your-aws-beanstalk-thing
 
Jan 5, 2010
1,773
0
0
So, I'm currently building a create-react-app, well, app, and my project manager isn't really interested in it outside of me learning how to use React, which I guess is fine, but now I'm pretty much done with all the app logic and features except for two (very crucial) points:

- The database is just two .json files I can't write to
- There is no user authentication

Since I very very much doubt my manager will get involved at any point (these were meant to be his part of the slack), I'm now looking into doing these part on my own.

So, what are the best solutions to these two issues within the create-react-app environment? I've read some things about Express.js (which I have not understood :3) and Auth0, is that what's being used for modern webapps?
 
Nov 26, 2014
1,896
0
270
I highly recommend not to mess with security related stuff alone like authentication if you don't have a clue. Because you will be the one that's responsible if anything goes wrong.

Anyway, you'll need some sort of back end. There a zillion options to build one. What languages are you good in? PHP? JS? Something else?


Maybe one of the API cloud services out there is an option, but I don't have experience with any of these.
 
Jan 5, 2010
1,773
0
0
I highly recommend not to mess with security related stuff alone like authentication if you don't have a clue. Because you will be the one that's responsible if anything goes wrong.

Anyway, you'll need some sort of back end. There a zillion options to build one. What languages are you good in? PHP? JS? Something else?


Maybe one of the API cloud services out there is an option, but I don't have experience with any of these.
I'm a UI developer, I'm competent with JS in that list and that's about it. As for auth stuff, yes I am clearly out of my depth, but also left to my own device so I don't really have much of a choice there... I'm ok with using third party middlemen if that works, I do have some experience setting up preset email users for an ember.js blog using Firebase...
 
Jul 13, 2007
21,470
0
0
Finland
So, I'm currently building a create-react-app, well, app, and my project manager isn't really interested in it outside of me learning how to use React, which I guess is fine, but now I'm pretty much done with all the app logic and features except for two (very crucial) points:

- The database is just two .json files I can't write to
- There is no user authentication

Since I very very much doubt my manager will get involved at any point (these were meant to be his part of the slack), I'm now looking into doing these part on my own.

So, what are the best solutions to these two issues within the create-react-app environment? I've read some things about Express.js (which I have not understood :3) and Auth0, is that what's being used for modern webapps?
Just use Auth0 if you can. It's cheap and provides an easy and safe way of integrating authentication for your app.
 
Jun 26, 2012
3,190
0
0
So, what are the best solutions to these two issues within the create-react-app environment? I've read some things about Express.js (which I have not understood :3) and Auth0, is that what's being used for modern webapps?
I'd look into Firebase. It's a (relatively) simple one-stop-shop for all your backend needs, and as long as it's a small project, it should fit comfortably within the free tier.

Edit: Oh haha, you mentioned Firebase in your follow-up! I'd definitely try it out if you're already familiar with it.
 
Jan 5, 2010
1,773
0
0
Just use Auth0 if you can. It's cheap and provides an easy and safe way of integrating authentication for your app.
Alright, trying it now, but that'll still leave the backend part of my issue to solve...

I'd look into Firebase. It's a (relatively) simple one-stop-shop for all your backend needs, and as long as it's a small project, it should fit comfortably within the free tier.

Edit: Oh haha, you mentioned Firebase in your follow-up! I'd definitely try it out if you're already familiar with it.
Yes, actually when I pitched the app, I offered to do it with Firebase as I was curious about the differences between the (serviceable but poorly documented IMO) ember integration and the React way of doing it. My manager said "no, Firebase is shit". I... Ok then :/
 
Jan 5, 2010
1,773
0
0
You don't understand, I enjoyed using Firebase, therefore it MUST BE shit!

I don't know what to say, it's just how things are for now. At least it pushes me into new areas, new stuff to learn about.
 
Jul 1, 2011
4,975
0
520
25
Málaga, Spain
So guys any idea why this responsive menu is only half working, it works fine on mobile but on my laptop screen I can't select the dropdown options.


fiddle: http://jsfiddle.net/p1mrtuex/9/

Here is the css:

Code:
.toggle,
[id^=drop] {
	display: none;
}

/* Giving a background-color to the nav container. */
nav { 
	margin:0;
	padding: 0;
	background-color: #254441;
}

#logo {
	display: block;
	padding: 0 30px;
	float: left;
	font-size:20px;
	line-height: 60px;
}

/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

nav:after {
	content:"";
	display:table;
	clear:both;
}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul {
	float: right;
	padding:0;
	margin:0;
	list-style: none;
	position: relative;
	}
	
/* Positioning the navigation items inline */
nav ul li {
	margin: 0px;
	display:inline-block;
	float: left;
	background-color: #254441;
	}

/* Styling the links */
nav a {
	display:block;
	padding:14px 20px;	
	color:#FFF;
	font-size:17px;
	text-decoration:none;
}


nav ul li ul li:hover { background: #000000; }

/* Background color change on Hover */
nav a:hover { 
	background-color: #000000; 
}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {
	display: none;
	position: absolute; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: 60px; 
}
	
/* Display Dropdowns on Hover */
nav ul li:hover > ul {
	display:inherit;
}
	
/* Fisrt Tier Dropdown */
nav ul ul li {
	width:170px;
	float:none;
	display:list-item;
	position: relative;
}

/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {
	position: relative;
	top:-60px;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:170px; 
}

	
/* Change ' +' in order to change the Dropdown symbol */
li > a:after { content:  ' +'; }
li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {

	#logo {
		display: block;
		padding: 0;
		width: 100%;
		text-align: center;
		float: none;
	}

	nav {
		margin: 0;
	}

	/* Hide the navigation menu by default */
	/* Also hide the  */
	.toggle + a,
	.menu {
		display: none;
	}

	/* Stylinf the toggle lable */
	.toggle {
		display: block;
		background-color: #254441;
		padding:14px 20px;	
		color:#FFF;
		font-size:17px;
		text-decoration:none;
		border:none;
	}

	.toggle:hover {
		background-color: #000000;
	}

	/* Display Dropdown when clicked on Parent Lable */
	[id^=drop]:checked + ul {
		display: block;
	}

	/* Change menu item's width to 100% */
	nav ul li {
		display: block;
		width: 100%;
		}

	nav ul ul .toggle,
	nav ul ul a {
		padding: 0 40px;
	}

	nav ul ul ul a {
		padding: 0 80px;
	}

	nav a:hover,
 	nav ul ul ul a {
		background-color: #000000;
	}
  
	nav ul li ul li .toggle,
	nav ul ul a,
  nav ul ul ul a{
		padding:14px 20px;	
		color:#FFF;
		font-size:17px; 
	}
  
  
	nav ul li ul li .toggle,
	nav ul ul a {
		background-color: #212121; 
	}

	/* Hide Dropdowns by Default */
	nav ul ul {
		float: none;
		position:static;
		color: #ffffff;
		/* has to be the same number as the "line-height" of "nav a" */
	}
		
	/* Hide menus on hover */
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
	}
		
	/* Fisrt Tier Dropdown */
	nav ul ul li {
		display: block;
		width: 100%;
	}

	nav ul ul ul li {
		position: static;
		/* has to be the same number as the "width" of "nav ul ul li" */ 

	}

}

@media all and (max-width : 330px) {

	nav ul li {
		display:block;
		width: 94%;
	}

}
And the html:
Code:
<nav>
        <div id="logo">Your Logo here</div>

        <label for="drop" class="toggle">Menu</label>
        <input type="checkbox" id="drop" />
            <ul class="menu">
                <li><a href="#">Home</a></li>
                <li>
                    <!-- First Tier Drop Down -->
                    <label for="drop-1" class="toggle">WordPress +</label>
                    <a href="#">WordPress</a>
                    <input type="checkbox" id="drop-1"/>
                    <ul>
                        <li><a href="#">Themes and stuff</a></li>
                        <li><a href="#">Plugins</a></li>
                        <li><a href="#">Tutorials</a></li>
                    </ul> 

                </li>
                <li>

                <!-- First Tier Drop Down -->
                <label for="drop-2" class="toggle">Web Design +</label>
                <a href="#">Web Design</a>
                <input type="checkbox" id="drop-2"/>
                <ul>
                    <li><a href="#">Resources</a></li>
                    <li><a href="#">Links</a></li>
                    <li>
                       
                    <!-- Second Tier Drop Down -->        
                    <label for="drop-3" class="toggle">Tutorials +</label>
                    <a href="#">Tutorials</a>         
                    <input type="checkbox" id="drop-3"/>

                    <ul>
                        <li><a href="#">HTML/CSS</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">Other</a></li>
                    </ul>
                    </li>
                </ul>
                </li>
                <li><a href="#">Graphic Design</a></li>
                <li><a href="#">Inspiration</a></li>
                <li><a href="#">Contact</a></li>
                <li><a href="#">About</a></li>
            </ul>
        </nav>
 
Jan 5, 2010
1,773
0
0
You've created a space between the <li> you're hovering to trigger the dropdown and said dropdown, so when you're trying to reach the dropdown, your pointer moves out of the "hovered" space therefore closing the subnav.

Change the CSS for the nav ul ul rule from top:60px to top: 100% and you'll see it work.
 
Jul 1, 2011
4,975
0
520
25
Málaga, Spain
You've created a space between the <li> you're hovering to trigger the dropdown and said dropdown, so when you're trying to reach the dropdown, your pointer moves out of the "hovered" space therefore closing the subnav.

Change the CSS for the nav ul ul rule from top:60px to top: 100% and you'll see it work.
Thanks man, there is no space between menu and the dropdowns BUT I can't still selct any of the dropdown options. I am out of ideas x(
 
Feb 7, 2013
2,799
0
0
Hey everyone, anyone here with experience in localizing wordpress websites? How would you do it? I tried using Loco translate but it seems that it can only translate theme/plugin/admin elements.
I guess one solution would be to make a second-level website in a different language, but it's seems overkill for the project I'm working on.
 
Jun 17, 2011
4,252
0
0
Rome, Italy
Hey everyone, anyone here with experience in localizing wordpress websites? How would you do it? I tried using Loco translate but it seems that it can only translate theme/plugin/admin elements.
I guess one solution would be to make a second-level website in a different language, but it's seems overkill for the project I'm working on.
Years ago I used Polylang for a couple of mid-sized projects.
Don't remember much about it though, except that it did its job.
 
Apr 15, 2010
25,095
1
0
Hey everyone, anyone here with experience in localizing wordpress websites? How would you do it? I tried using Loco translate but it seems that it can only translate theme/plugin/admin elements.
I guess one solution would be to make a second-level website in a different language, but it's seems overkill for the project I'm working on.
I've used:
WPML (WordPress MultiLingual) https://wpml.org/
Smartling + WPMultiSite/WP Network: https://www.smartling.com/

Smartling is a very expensive translation service (tens of thousands and hundreds of thousands of dollars) that uses WPMultiSite/Network to handle translations with a translation API and thousands of translators around the world. It's a strong option for major brands who have a lot of money to sink into good translations. This is probably not the right approach as its primary focus major corporations who need to translate into a lot of languages.

WPML is a solid foundation for what it sounds like your'e doing. It does kind of do what you're suggesting in a way. When you create a page/post/etc (anything in the WP dashboard really) in WP, it basically allows you to make a duplicate of that page as the 'translated' version. It has some workflow features in place to finalize and approved translated content, and then you add a dropdown/language switcher to your website that uses a cookie that keeps a user on the right language option. I forget if there's support for subdomains or subdirectories for languages, but I think WPML uses subdirectories by default.

So let's say you have an English language page called "My Sister is a Potato," and the link is website.com/my-sister-is-a-potato/. You've decided you want to translate this page into German.
In WPML, you've checked off German as an option, and after creating your page in English, there's a check/option to create a German language page for that. WPML creates a new page fo ryou, but it's almost like a symlink to your original page, and then you put in the title... website.com/meine-schwester-ist-eine-kartofel/ and you provide the content. Those two pages are connected to one antoher, so if the visitor has the German cookie in their browser, if they go to the my-sister-is-a-potato link, it'll automatically take them to /de/meine-schwester-ist-eine-kartofel page. I *think* that WPML also does canonical URLs in the header and other good practices for SEO, but I don't think it's cutting edge in that regard. FWIW, I don't think a lot of translation plugins are cutting edge for SEO and translations (there's a lot that can go into it... I'm a developer for a multi-national corp, and while we're not using WP at all, translations is an important aspect of our website and there's some universal best practices for translating content and SEO). From what I remember, for any page that isn't translated, it keeps a user on the /de/ sub-directory but just displays the English language / non-translated page. So it's not like your site breaks or 404s if you haven't translated a specific page (like, say, all of your "About" pages are translated, but your blog is in English).

WPML is a good, popular translation system for WordPress. It probably requires more work upfront than an automated translation service, but it's free and very well known and has a strong community.

For plugins and themes it uses string translation, which is fine, but many plugins and most themes are probably set up wrong so you might need to do some manual work there for strings that are hardcoded into the theme or plugin.
 
Feb 7, 2013
2,799
0
0
Years ago I used Polylang for a couple of mid-sized projects.
Don't remember much about it though, except that it did its job.
I've used:
WPML (WordPress MultiLingual) https://wpml.org/
Smartling + WPMultiSite/WP Network: https://www.smartling.com/

Smartling is a very expensive translation service (tens of thousands and hundreds of thousands of dollars) that uses WPMultiSite/Network to handle translations with a translation API and thousands of translators around the world. It's a strong option for major brands who have a lot of money to sink into good translations. This is probably not the right approach as its primary focus major corporations who need to translate into a lot of languages.

WPML is a solid foundation for what it sounds like your'e doing. It does kind of do what you're suggesting in a way. When you create a page/post/etc (anything in the WP dashboard really) in WP, it basically allows you to make a duplicate of that page as the 'translated' version. It has some workflow features in place to finalize and approved translated content, and then you add a dropdown/language switcher to your website that uses a cookie that keeps a user on the right language option. I forget if there's support for subdomains or subdirectories for languages, but I think WPML uses subdirectories by default.

So let's say you have an English language page called "My Sister is a Potato," and the link is website.com/my-sister-is-a-potato/. You've decided you want to translate this page into German.
In WPML, you've checked off German as an option, and after creating your page in English, there's a check/option to create a German language page for that. WPML creates a new page fo ryou, but it's almost like a symlink to your original page, and then you put in the title... website.com/meine-schwester-ist-eine-kartofel/ and you provide the content. Those two pages are connected to one antoher, so if the visitor has the German cookie in their browser, if they go to the my-sister-is-a-potato link, it'll automatically take them to /de/meine-schwester-ist-eine-kartofel page. I *think* that WPML also does canonical URLs in the header and other good practices for SEO, but I don't think it's cutting edge in that regard. FWIW, I don't think a lot of translation plugins are cutting edge for SEO and translations (there's a lot that can go into it... I'm a developer for a multi-national corp, and while we're not using WP at all, translations is an important aspect of our website and there's some universal best practices for translating content and SEO). From what I remember, for any page that isn't translated, it keeps a user on the /de/ sub-directory but just displays the English language / non-translated page. So it's not like your site breaks or 404s if you haven't translated a specific page (like, say, all of your "About" pages are translated, but your blog is in English).

WPML is a good, popular translation system for WordPress. It probably requires more work upfront than an automated translation service, but it's free and very well known and has a strong community.

For plugins and themes it uses string translation, which is fine, but many plugins and most themes are probably set up wrong so you might need to do some manual work there for strings that are hardcoded into the theme or plugin.
Thank you both for the suggestions.
To be clear, I would be the one translating (Italian -> english), since the website is very small (<10 pages). I will try the free option (Polylang) first, and see how it goes.
 
Aug 23, 2006
2,770
0
0
anyone use aws/etc for development? i've been doing it for years, but i've been doing it all in windows environments.

right now i'm working on a project with a lot of linux dependencies where a linux based dev environment would be great- but anything beyond ssh'ing into a linux aws instance seems horrible! i've tried VNC and XRDP. VNC was slow as hell and XRDP (rdp'ing from windows) was buggy- crashing the xrdp service when attempting to connect. talked to a co-worker who has been coding on linux and he's using... VIM... as his editor.. via SSH...

anyone found success with aws linux development?
 
Jul 13, 2007
21,470
0
0
Finland
anyone use aws/etc for development? i've been doing it for years, but i've been doing it all in windows environments.

right now i'm working on a project with a lot of linux dependencies where a linux based dev environment would be great- but anything beyond ssh'ing into a linux aws instance seems horrible! i've tried VNC and XRDP. VNC was slow as hell and XRDP (rdp'ing from windows) was buggy- crashing the xrdp service when attempting to connect. talked to a co-worker who has been coding on linux and he's using... VIM... as his editor.. via SSH...

anyone found success with aws linux development?
Have you tried Docker?
 
Aug 16, 2012
2,932
1
0
UK
I'm primarily a software dev but I've got a decent amount of experience with JavaScript/CSS. I was wondering what my options were if I wanted to host a Java program online? For example I wanted a web form whose inputs would be sent to and processed by my program and have the results displayed on a separate webpage.
 
Aug 23, 2006
2,770
0
0
Have you tried Docker?
docker is a big part of our operation and is something we consider in all aspects, including our dev environments. that said, it is a big part of the hangup in setting up dev environments remotely (re: nested virtualization).

we have a requirement of working on remote machines -- we can't install anything on the local box. so we can't have say HyperV or VirtualBox running a linux vm with docker spinning up containers.

i have landed on a potential solution which is to use Guacamole for rdp'ing, but in addition to the extra effort for setting up Guac, i don't even know how it will perform.

right now, i'm leaning heavily towards eliminating linux desktop experience from the equation. i have better solutions when that happens.
 
Jun 19, 2013
10,866
1
470
UK
Am I right in thinking that it would be futile to build a bespoke shopping cart from scratch as opposed to using something pre built?

What cart systems do you guys for ecommerce solutions? If it makes a different the payment gateway I need to integrate is handepay.

The system I need to implement is a booking system for coach tours, they have something in WordPress that they hate hence the enquiry about changing.
 
Feb 7, 2013
2,799
0
0
Am I right in thinking that it would be futile to build a bespoke shopping cart from scratch as opposed to using something pre built?

What cart systems do you guys for ecommerce solutions? If it makes a different the payment gateway I need to integrate is handepay.

The system I need to implement is a booking system for coach tours, they have something in WordPress that they hate hence the enquiry about changing.
What do they use currently?
 
Apr 15, 2010
25,095
1
0
I'm primarily a software dev but I've got a decent amount of experience with JavaScript/CSS. I was wondering what my options were if I wanted to host a Java program online? For example I wanted a web form whose inputs would be sent to and processed by my program and have the results displayed on a separate webpage.
I don't have any experience building Java web applications, but it should be fairly similar to other programming languages like Ruby or JavaScript, where you can have your application in a web-accessible VM (hosted by say Amazon Web Services, Google Cloud Platform, Microsoft Azure, etc), and then create a RESTful API in Java that communicates with your application. The front end can be whatever you want (HTML/CSS/JS), and when somebody submits form data, it hits your API, which then routes that data over to your hosted Java application, and your application does something with it.

THere are a handful of tutorials online creating RESTful APIs using Java or in the java world: http://www.vogella.com/tutorials/REST/article.html

And if you have JS experience, there's no reason why you couldn't create your RESTful API in JavaScript and have a small JS application send the form data over to your java app, I'm just not sure what data format the java app expects.

IF you look into it and build something let us know what you build, interested in the technique you take in the end.

Am I right in thinking that it would be futile to build a bespoke shopping cart from scratch as opposed to using something pre built?

What cart systems do you guys for ecommerce solutions? If it makes a different the payment gateway I need to integrate is handepay.

The system I need to implement is a booking system for coach tours, they have something in WordPress that they hate hence the enquiry about changing.
I completely agree with using a prebuilt shop/cart... There's a lot of work that goes into that.
My WordPress clients have used WooCommerce and most have been happy with it. A client MANY years ago used Shopp and it sucked.

For non WP ecommerce suites, Magento is really popular and has a ton of resources online, but I've never used/developed with it
 
Nov 13, 2005
964
0
0
Just joined in on a freelance project where the team has not been confident in the main developer and their work... And I've been brought in to try to help get it finished.

Better prepare for the worst. If my experiences are any indication 'not confident in their work' is probably putting it mildly.
 
Apr 15, 2010
25,095
1
0
Better prepare for the worst. If my experiences are any indication 'not confident in their work' is probably putting it mildly.
Is the main developer still there? If they get defensive then things can get ugly.
Yep... I'm preparing for it. She's not respondent, has these insane excuses... Like going back through the slack logs, there'd be days of silence from her and then these really complex excuses, followed up by promises of like "I'm pushing the latest build tonight!" and then the client would ask the nex tmorning where the build is, followed by 24 hours of silence, and then she'd finally check in and be like "Oh that's so weird I pushed i but my network must have gone out when I was deploying so it was never put up there."

I think she's probably a good developer, but it's been 4 days since I jumped on and I still haven't gotten access to the repository. LAst night, she told me she'd set me up with access and.. well.. that was 12 hours ago..

Truth is, I just want to come in, finish off the requirements that the client needs, and get paid. Don't care about anything else. But yeah the main developer is still on the project. It's always weird, but the project manager seems pretty competent and sounds like he'll be able to mitigate any issues. I've worked with plenty of developers to think it'll be fine, but it ain't ideal.
 
Mar 28, 2013
16,906
2
0
tetrisforkicks.com
I'm about to start studying again.

I'd like to learn a JS framework, these are the ones most companies are asking for:

Angular
Vue
React
Ember

Which would be the best one to begin with?

EDIT: I see my question has been handled above, nevermind! Thanks for the previous replies. :)
 
Apr 15, 2010
25,095
1
0
Probably not Ember. Of those four, it's the least in demand.

If I were to rank them for some sort of job in demand-ness, personal preference, and hotness matrix... I'd rank them:

1. React
2. Vue
3. Angular
...
9. Ember

Now, personally I've liked Vue more than React, but React has squared off a much larger portion of the market than Vue, and if you're being interviewed for a position with a heavy focus on Vue, you need to know your shit because they've chosen Vue for a reason. Angular has a lot of demand, but it's fallen out of popularity at least as like "the hot JS library" of the moment. React isn't the hot framework that it was a year ago or 18 months ago, but it's hit a sweet spot of still being hot, still being in demand, and still being very practical and worth learning.

Ember, I just don't see anybody looking for Ember development specifically anymore. MAybe that'll tick up, but Ember has kinda followed Meteor (or maybe Meteor has followed Ember), both pretty near JS application frameworks, but they just never captured the zeitgeist like React and Angular did (and that Vue is trying to capture).
 
Mar 28, 2013
16,906
2
0
tetrisforkicks.com
Probably not Ember. Of those four, it's the least in demand.

If I were to rank them for some sort of job in demand-ness, personal preference, and hotness matrix... I'd rank them:

1. React
2. Vue
3. Angular
...
9. Ember

Now, personally I've liked Vue more than React, but React has squared off a much larger portion of the market than Vue, and if you're being interviewed for a position with a heavy focus on Vue, you need to know your shit because they've chosen Vue for a reason. Angular has a lot of demand, but it's fallen out of popularity at least as like "the hot JS library" of the moment. React isn't the hot framework that it was a year ago or 18 months ago, but it's hit a sweet spot of still being hot, still being in demand, and still being very practical and worth learning.

Ember, I just don't see anybody looking for Ember development specifically anymore. MAybe that'll tick up, but Ember has kinda followed Meteor (or maybe Meteor has followed Ember), both pretty near JS application frameworks, but they just never captured the zeitgeist like React and Angular did (and that Vue is trying to capture).
Ok, I'll go for React to begin with then. It was a toss-up between that and Angular mostly.

Thanks!
 
Aug 9, 2006
19,682
0
0
Oh boy, I'm implementing a service worker library that will eventually be expected to be used by 20+ teams in my organization. Also I get to make a presentation about it at an internal dev conference in December. Exciting and terrifying. Even if I don't cause the inevitable caching issue that will bring down the site, I'll probably be on the hook for it.
 
Nov 26, 2014
1,896
0
270
Ok, I'll go for React to begin with then. It was a toss-up between that and Angular mostly.

Thanks!
And redux. Don't forget Redux if you go for React. React + Redux is just awesome.

What I wouldn't do is trying to master multiple frameworks of that size. They can be really overwhelming at times.


Anyone have a favorite non-Sketch prototyping tool? I'm looking at Zeplin (free) or Adobe XD CC for 10/month.
Isn't Zeplin just a pimped viewer for Sketch files?