Web Development

  • cross-device application
    by /u/kekkimo on February 18, 2020 at 11:26 pm

    Hello, i want to develop an app that can be used on desktop, mobile and web on the same time and with nearly the same code, so updates will be done on all platforms at the same time. Which is the best framework to use? And is it possible to export the app to exe in the case of desktop app? submitted by /u/kekkimo [link] [comments]

  • [OC] Undoing stuff in git
    by /u/hugesavings on February 18, 2020 at 10:49 pm

    submitted by /u/hugesavings [link] [comments]

  • Centering a div That Maintains Aspect-Ratio When There’s Body Margin
    by Chris Coyier on February 18, 2020 at 10:33 pm

    Andrew Welch had a little CSS challenge the other day to make an ordinary div: • centered vertically + horizontally• scales to fit the viewport w/ a margin around it• maintains an arbitrary aspect ratio• No JS There's a video in that tweet if it helps you visualize the challenge. I saw Paul Bakaus blogging about this the other day, too, so it's a thing that comes up! Mark Huot got fancy applying aspect ratios directly with … Read article The post Centering a div That Maintains Aspect-Ratio When There’s Body Margin appeared first on CSS-Tricks.

  • Do you like beautiful design? Did you hear about those bushfires in Australia? Here's yet another stunning webpage from the design team at ABC News (AU) Story Lab
    by /u/pedad on February 18, 2020 at 10:08 pm

    https://www.abc.net.au/news/2020-02-19/australia-bushfires-how-heat-and-drought-created-a-tinderbox/11976134 And if you want to see more of their work: https://www.abc.net.au/news/interactives/ submitted by /u/pedad [link] [comments]

  • I'm building an app for Car Dealerships to car profiles with images to advertise their inventory. What is the best way to handle the admin interface?
    by /u/Zarathustra420 on February 18, 2020 at 10:06 pm

    **I'm building an app for a car dealership to upload and manage car profiles and images to advertise their inventory. The backend is an Express API and most of the profile data is going to be stored in Postgres on the same server. I'm considering using Firebase for the Image Hosting rather than storing it on the server; the biggest hurdle I'll need to cross is managing the New Profile uploads, including the image uploads. This will include setting a primary image, potentially changing the list order of the uploaded images... I'd like to avoid using a CMS, but if that ends up being the best option I'm willing to try it. submitted by /u/Zarathustra420 [link] [comments]

  • Dynamic content and URLs based on location
    by /u/buddabudbud on February 18, 2020 at 9:21 pm

    Been trying to figure out how to set this up but can't figure it out. I have a site with basic dynamic pages and content, which works fine, however I've noticed with real estate sites such as: https://www.zoopla.co.uk/for-sale/property/shrewsbury/?q=Shrewsbury%2C%20Shropshire&results_sort=newest_listings&search_source=home Every single location (cities, towns, villages and even neighborhoods) pull in dynamic content. I'm assuming that these types of sites don't add in hundreds of thousands of pages corresponding to each location. Dynamic pages such as the individual property listings I can setup, however it's the location search I can't figure out. So my question, how do large real estate sites generate dynamic URLs, breadcrumbs and titles based on a location? If anyone could point me to some resource to learn, that would be awesome submitted by /u/buddabudbud [link] [comments]

  • Need ideas for Portfolio Website
    by /u/marjaygab on February 18, 2020 at 9:17 pm

    Hello everyone! I'm pretty new here in Reddit. I am currently on my first 6 months of professional work and a freelancing job consisting of an Inventory System used by a General Merch Store. I also did projects when I was a student and before I got a job, mainly in PHP. Now, I want to compile them in a portfolio. I am thinking if I can also use the portfolio website as an entry to my list of projects. With that, I am thinking of other ways to show to the possible viewers of my website my knowledge of PHP to let them appreciate the backend side of things. If there are points that are unclear please do not hesitate to ask. Thank you very much! submitted by /u/marjaygab [link] [comments]

  • How can I prepare for a job in PHP?
    by /u/Daniel1836 on February 18, 2020 at 9:01 pm

    I've decided that front end may not be a good specialty for me because I'm not fond of the pressures of perfecting designs and such. I am also very analytical and logical minded and have a preference for PHP; most of the interviews I get called for involve PHP. So how can I prepare for an entry level job coding PHP? I have an 8 month formal education in web dev and I self study all the time. So far I have a good understanding of CRUD apps and have built a fairly complex one on my portfolio, using forms and a MYSQL database. I have studied object oriented PHP some, but find it quite abstract and don't really see how it is useful in practice in the big picture. I have looked at some solutions to different security issues such as SQL injection etc. I have installed the Laravel framework and am currently practicing different things on it such as routing, controllers etc. A few questions: 1-What specific topics in PHP should I focus on, and what kind of projects should I build to learn? 2-What minimum proficiencies do you think I should have to be considered for a junior PHP role? 3-Specific courses/resources/udemy/sites to study from? 4-I hear front end HTML/CSS monkey is the easiest job in web dev to get as a junior. Is it harder to get a junior back end PHP job? 5-What points should I sell myself on in the interview? (competencies etc) I have decided this is the area of web dev I want to focus on, and committed to go all in on it. ​ Thanks for your time submitted by /u/Daniel1836 [link] [comments]

  • My schedule doesn't allow me much time to study. Should I give up?
    by /u/MirukuChu on February 18, 2020 at 8:57 pm

    My goal is to become a freelance web developer. Unfortunately, as the title suggests, I simply don't have that much time to study. On the weekdays, I can generally get 30 minutes to an hour of studying/practice coding, sometimes more depending on the day. I have more time on the weekends (2-4 hours), although I'm usually worn out from the week so it's difficult to focus. I feel comfortable with HTML and CSS, and I'm about to start learning JS, but I'm wondering if it's even worth it. Is it unreasonable on my part to pursue a career in web development when I have relatively little time to study? Has anyone else done it? Alternatively, if this doesn't work out, I've considered focusing on web design instead. I hear that it's less difficult, and I'm comfortable with design. Is that a good idea? submitted by /u/MirukuChu [link] [comments]

  • how to animate a css element only when it appears on the window?
    by /u/oussama111 on February 18, 2020 at 8:47 pm

    i mean in sites like https://joinhandshake.com/ and alot other, the elements are animated only when you scroll on them, is there a library for that?, and how can i do that with pure css? submitted by /u/oussama111 [link] [comments]

  • Solving Sticky Hover States with @media (hover: hover)
    by Chris Coyier on February 18, 2020 at 8:38 pm

    Mezo Istvan does a good job of covering the problem and a solution to it in a blog post on Medium. If you tap on something that has a :hover state but you don't leave the page then, on a mobile device, there is a chance that :hover state "sticks." You'll see this with stuff like jump-links used as tabs or buttons that trigger on-page functionality. The post Solving Sticky Hover States with @media (hover: hover) appeared first on CSS-Tricks.

  • Question about getting started in web development, problems facing along the way and getting my mind around it
    by /u/Undic1d3d on February 18, 2020 at 8:19 pm

    Hi to all the Redditors out there who are reading my post. I know it's been asked a lot but i think what i'm about to ask is a little bit more of a general discussion and getting tips from the experts. And it might even help some new people as well. It's been a while i wanted to write this post and finally found some time to write it. I'm a 24 years old guy studying software engineering. I recently lost my dad (14th of Jan), he was suffering from lung cancer. Anyways, it's been a while that i wanted to jump in web development and with the situation i'm stuck in, i'm trying to decide for my future and the things i need to do. I've watched some videos and read posts about the web development technologies and languages i need to learn and think i got a quite good grasp of what is needed for now, so no more question around it. It's a post questioning about the guidelines, things to consider and expect from the expert in the business. As i said i've been studying software engineering and am familiar with programming. I've been coding C++ for a while and know a little bit of HTML and JS, I can learn things quickly, problem solving is quite easy for me and i can find new solution for problem quite frequently, so please keep that in mind. Also i'm thinking of becoming a freelance web developer and accepting projects rather than working in a company. I won't waste more of your time and will jump right at it. ​ - How long does it take to be able to call yourself a "Front-End"/"Back-End"/"Full-Stack" developer? (I know web development and in general technology is like a never-ending-knot and you can never learn everything and anything) . So what i'm trying to ask is how long it would take to be able to work as a web developer and stand out? - How much should i charge at the beginning and how much (is normal) to charge as i gain more experience? - How much can i expect to earn as a beginner? - What are some tips to stay up-to-date and sharpen my skills? - How can i stand out, make myself let's say a "brand" and become a person who businesses want to hire me as a trusted developer and wish to come back for more? - What would be your number one tip and some other things you wish you would know when you started out? - Is it my responsibility to support the website or app even after developing it? Thanks for taking your time reading my post and answering. It means a world to me. Sorry if my post is not organized enough or is in a wrong subreddit. Please feel free to add any more information or suggestions as it would surely help me out. submitted by /u/Undic1d3d [link] [comments]

  • Are these books good to use in 2020
    by /u/MythicFrost on February 18, 2020 at 7:44 pm

    The title pretty much summarises it. Are these two books still worth using as learning material in 2020? Book 1 - https://www.amazon.co.uk/gp/product/1118008189/ref=dbs_a_def_rwt_hsch_vapi_taft_p1_i1 Book 2 - https://www.amazon.co.uk/gp/product/1118531647/ref=dbs_a_def_rwt_hsch_vapi_taft_p1_i2 Thanks for your time in helping me out. submitted by /u/MythicFrost [link] [comments]

  • Module federation and code sharing between bundles. Huge changes coming to frontend with webpack@5
    by /u/NoLanSym on February 18, 2020 at 7:43 pm

    submitted by /u/NoLanSym [link] [comments]

  • IMO .Net webforms doesn't get enough credit
    by /u/avatart0ph on February 18, 2020 at 6:18 pm

    A year ago I started learning and working with react. I've realized, react's component isn't brand new. They didn't call it components but the idea of ASP.Net webforms is almost similar to how you would create and use components. ASP.Net wasn't fun to use but it works. Webforms had a library of built in components, and you just plugin the necessary items to get that component to work. Repeaters, dropdown, radiobutton list ETC. You can also create your own. I feel like .Net webforms doesn't get enough credit for their work. I just wanted to share this opinion and see what other developers say submitted by /u/avatart0ph [link] [comments]

  • Need help understanding microservices components
    by /u/LiamKRP on February 18, 2020 at 6:11 pm

    So I am trying to understand how microservices work, I have a general concept of how they work but there are some things that I still dont understand, so I would like to see if anybody could clarify some concepts and also point me in some direction of how to start learning, like what software I need to learn. So my question is basically which are the main software components that a microservice architecture contains, I am guessing there are some optional ones, but I would like to know which are the essential ones, I heard things like load balancer, proxy gateway etc, these are the things I am refering to as in what they are and which ones I need, and what are there main purpose for the system, and also if anybody could also give examples of each one it would be great. I have heard things like kubernetes, docker, nginx etc Besides that how can i start learning how to make a web app with this architecture, I am guessing I will have to learn the main software components I mentioned before (that is why I am asking), is there anything else I should learn? Any resources would be apreciated. Thanks!! submitted by /u/LiamKRP [link] [comments]

  • Great article that summarizes how to trigger individual animations exported from a single AE Timeline or composition with Lottie-web / BodyMovin
    by /u/clzdeezy on February 18, 2020 at 6:03 pm

    submitted by /u/clzdeezy [link] [comments]

  • Asked to quote hours by manager.
    by /u/avatart0ph on February 18, 2020 at 5:51 pm

    Anyone here always getting asked --- how long do you think this site/feature will take? Without any breakdown.... It's like being asked, how long do you think you can finish building this house (with no specs). How do you handle this? I've learned to say I need more time to look into it. But before, I used to wing it. And usually regretting it. submitted by /u/avatart0ph [link] [comments]

  • Designing a simple REST Api
    by /u/tMGK_ on February 18, 2020 at 5:41 pm

    Hi all, I'm somewhat new to creating REST APIs and thus not fully sure on how they should be designed. I need to create really simple API and I'd like to do it correctly to gain a better understanding of their design principles. My api will (at least) three endpoints: - #1 (lets the client subscribe to a certain type of event) - #2 (lets the client unsubscribe from a certain type of event) - #3 (lets the client get a list of his subscriptions) The subscriptions are stored in a database, and duplicate subscriptions are not allowed. With this in mind, I'm looking for general advice on how to structure my API: - What should the routes/urls look like - Which HTTP methods should be used and which HTTP codes should be returned. - Anything else that comes to mind? I realize this is probably quite trivial but nonetheless any thoughts and advice are very much appreciated! It's written in dotnet core fwiw submitted by /u/tMGK_ [link] [comments]

  • Need small project ideas
    by /u/p01yg0n41 on February 18, 2020 at 5:40 pm

    Hi, folks. I'm teaching a webdev course and my students will soon begin working on a mid-semester project for which they have to build a "mini-app" (which I envision basically as a functional prototype to practice building/installing/standing-up a simple app of some kind). They can choose which technologies to use (of the ones we're covering): php/laravel, react, angular, vue, ruby on rails, static site generator, even wordpress, etc. I'm emphasizing that this "mini-app" is really just proof of concept and doesn't need to be fully working and definitely not finished. This is an advanced course, so my students all have strong HTML+CSS+JS, the ability to set up and customize a dev environment, and the capability to work from the command line. Anyway, I've generated several suggestions that might work, things like: a to-do app, a task scheduler, a music-sharing app, a custom blog platform, a JS calculator, stuff like that. What I'm wondering is if you all have ideas for simple little apps like this that students could build to help them get the feel for working with a particular stack. Any and all ideas are welcome! Thanks in advance. submitted by /u/p01yg0n41 [link] [comments]

  • Use ipdata’s Geolocation Data to Protect & Customize Your Site
    by Adrian Try on February 18, 2020 at 5:00 pm

    This article was created in partnership with GoGetSSL. Thank you for supporting the partners who make SitePoint possible. Modern websites are becoming more and more effective at customizing content based on their visitors’ location. They can redirect users to a page in their own language, display prices in the local currency, pre-fill webforms with location information, and show the current time and date for the correct timezone. ipdata is a low-latency API that provides website owners with a wide variety of information about their visitors based on IP address (IPv4 and IPv6). Think of it as an IP geolocation and threat intelligence API. By using a visitor’s IP address you can learn their continent, country, region, city, latitude and longitude, organization or ISP, and timezone. The API also detects Proxy and Tor users, as well as known spammers and bad bots. Blocking these risks will protect your website, and reduce the need for security strategies like CAPTCHA. Let’s look specifically at some ways ipdata can help, and how to implement them on your own website. Redirect Visitors and Localize Content When you visit the ipdata website you’ll immediately see what the service is capable of. Everything that can be learned from your own IP address is displayed. That data includes: Whether you’re in the EU, Your city, State or region (and region code), Country (and country code), Continent (and continent code), Latitude and longitude, Postal or zip code, Country calling code, Your country’s flag emoji, Your service provider’s ASN and carrier information, Languages, Currency (name, code, symbol, plural), Time zone (name and abbreviation, offset, daylight savings time, current time), Threat information (Tor, Proxy, anonymous, known attacker, known abuser, threat, bogon). You can call ipdata's API on each page request to geolocate your visitors and localize their content. Here’s a handful of ideas of what you can achieve: Restrict or block access to your content to specific countries or continents, Redirect users to country-specific (or language-specific) sites or pages, Pre-fill your webforms with their location data, Show your visitors their local time and weather, Display events that are near your visitors, or available flights in their area, Serve targeted ads based on location, Enforce GDPR compliance, Automatically convert prices on your e-commerce store to their local currency, using the correct currency symbol, More accurately analyze where your traffic is coming from. You can get a client’s IP address using JavaScript, but it’s a bit of work. Instead, use ipdata’s API. It’s super-fast and reliable across all browsers. Here’s the code: $.get("https://api.ipdata.co?api-key=test", function(response) { console.log(response.ip); }, "jsonp"); Once you have a visitor’s API address, ipdata’s documentation shows you how to get their location in 26 different languages. You’ll also find detailed tutorials on how to code for a variety of use cases. Here are a few examples. To block (or allow) users by country, look up the ISO 3166 ALPHA-2 Country Codes for the ones you want to blacklist or whitelist. Then follow this sample code to learn how to blacklist or whitelist them. // List of countries we want to block // To see this in action add your country code to the array var blacklist = ['US', 'CA', 'UK', 'IN'] // Getting the country code from the user's IP $.get("https://api.ipdata.co?api-key=test", function (response) { // Checking if the user's country code is in the blacklist // You could inverse the logic here to use a whitelist instead if (blacklist.includes(response.country_code)) { alert('This content is not available at your location.'); } else { alert("You're allowed to see this!") } }, "jsonp"); Redirecting users by country is useful if you have country-specific online stores, or if you have a separate page with content in their language or with country-specific contact details. Here’s an example of how to redirect your visitors located in Germany and Australia. They will be redirected from https://uk.store.ipdata.co to https://de.store.ipdata.co and https://au.store.ipdata.co. // Getting the country code from the user's IP $.get("https://api.ipdata.co?api-key=test", function (response) { if (response.country_code == 'UK') { window.location.href = "https://uk.store.ipdata.co"; } else if (response.country_code == 'DE') { window.location.href = "https://de.store.ipdata.co"; } else if (response.country_code == 'AU') { window.location.href = "https://au.store.ipdata.co"; } }, "jsonp"); You can also personalize the content of your site depending on the user’s location. Here’s an example that displays a special offer to UK visitors only: // Getting the country name from the user's IP $.get("https://api.ipdata.co?api-key=test", function (response) { if (response.country_code == 'UK') { alert("Special offer for all our users from " +response.country_name+ "!"); } }, "jsonp"); Instead of targeting a whole country, you can drill down to region, city or postal code (zip code). Alternatively, you could target a time zone or specific currency. You can further personalize your content by displaying the user’s local time (adjusted for DST) and local currency symbol. To request time zone data for IP address “”: $ curl https://api.ipdata.co/ You’ll receive this response, which includes the name and abbreviation of the time zone, its UTC offset, whether it is currently DST, and the local time: { "name": "America/Los_Angeles", "abbr": "PDT", "offset": "-0700", "is_dst": true, "current_time": "2019-03-27T01:13:48.930025-07:00" } Currency detection is similar. Here’s an example for the IP address “”: curl https://api.ipdata.co/ And the response: { "name": "Australian Dollar", "code": "AUD", "symbol": "AU$", "native": "$", "plural": "Australian dollars" } Protect Your Website from Threats You can also use ipdata to identify potential threats against your website. They maintain a database of over 600 million malicious IP addresses, open proxies, Tor nodes, spammers, botnets, and attackers. These are aggregated only from high-quality, authoritative sources. You can use this information in a variety of ways: Protect your comments by blocking known spammers and bad bots, alleviating the need for CAPTCHA, Detect frauds by determining if their credit card is from a country different to where they are located, Block anonymous traffic to eliminate the risks that come from such networks, Block high-risk countries, such as the countries where most of your malware and attacks originate, Prevent “free trial abuse” by detecting Proxy and Tor users. Here’s how to access the threat data for the IP address “”: curl https://api.ipdata.co/ The request generates the following response: { "is_tor": true, "is_proxy": false, "is_anonymous": true, "is_known_attacker": false, "is_known_abuser": false, "is_threat": false, "is_bogon": false } The visitor is using a Tor network. is_anonymous is true if the visitor is either a Tor or Proxy user. You can use ipdata to stop anonymous users creating an account. Here’s some sample code from the official documentation: // Getting the anonymity status from the user's IP $.get("https://api.ipdata.co?api-key=test", function (response) { if (response.threat.is_anonymous) { alert("You are not allowed to create an account."); } }, "jsonp"); You can get more specific, for example, by blocking Proxy users but letting Tor users through: // Getting the anonymity status from the user's IP $.get("https://api.ipdata.co?api-key=test", function (response) { if (response.threat.is_proxy) { alert("You are not allowed to create an account."); } }, "jsonp"); Some users are repeat offenders, having been repeatedly reported by admins of other websites for spam or malicious activity. You can stop them from creating an account by blocking them if one of these fields are true: is_known_abuser: IP addresses that have been reported to be sources of spam, is_known_attacker: IPs that have been reported to be the source of malicious activity. Why Choose ipdata? ipdata compares very favorably with other IP Geolocation APIs. It is written in Python 3 with an average execution time of 2.9 ms. It’s fast and reliable enough to keep a long list of clients happy, including Comcast, Redhat, Cooperpress, Sphero, AMD, and NASA. ipdata is highly scalable, with low latency globally. The API serves millions of requests every day at an average speed of just ~65ms, and runs in eleven data centers around the world: 4 in the US, 1 in Canada, 2 in Europe (London and Frankfurt), 1 in India (Mumbai), 1 in South America (Sao Paulo), 1 in Europe (Seol), and 1 in Australia (Sydney). According to Jonathan Kosgei, the Founder of ipdata, execution time is kept low by not doing any database reads or writes in the application code. “A separate authorizer function handles getting usage data from DynamoDB and authorizing users based on whether they’re within their quota or not. And its results are cached.” Start Geolocating Your Visitors with ipdata By now I’m sure you’ve thought of a dozen ways you can use ipdata to enhance and protect your website, or those of your clients. Sign up for free and start testing it! The service is Jonathan Kosgei’s first SaaS, and he’s quite transparent about the smart way he set it up and the lessons he learned along the way. Learn from his experiences in his guest posts: How to build a SaaS with $0 (Hackernoon)—here he lists the free tiers of numerous products that enabled him to build the service without a large initial outlay, How ipdata uses AWS to serve a global, highly-scalable IP geolocation API (AWS Startups Blog)—goes into more detail with a focus on AWS, How Ipdata Serves 25M API Calls From 10 Infinitely Scalable Global Endpoints For $150 A Month (High Scalability)—details how he responded to a failure on Black Friday by choosing a new tech stack. The post Use ipdata’s Geolocation Data to Protect & Customize Your Site appeared first on SitePoint.

  • Maintaining a zero-maintenance website
    by /u/bckygldstn on February 18, 2020 at 4:09 pm

    submitted by /u/bckygldstn [link] [comments]

  • How to Build Vue Components in a WordPress Theme
    by Jonathan Land on February 18, 2020 at 3:27 pm

    The inline-template directive allows us to build rich Vue components as a progressive enhancement over existing WordPress markup. The post How to Build Vue Components in a WordPress Theme appeared first on CSS-Tricks.

  • Web Component for a Code Block
    by Chris Coyier on February 18, 2020 at 3:27 pm

    We'll get to that, but first, a long-winded introduction. I'm still not in a confident place knowing a good time to use native web components. The templating isn't particularly robust, so that doesn't draw me in. There is no state management, and I like having standard ways of handling that. If I'm using another library for components anyway, seems like I would just stick with that. So, at the moment, my checklist is something like: Not using any other JavaScript … Read article The post Web Component for a Code Block appeared first on CSS-Tricks.

  • What is the difference between procedural and object oriented PHP and which one should I use?
    by /u/Blauer_stift on February 18, 2020 at 2:57 pm

    At the moment I use procedural php submitted by /u/Blauer_stift [link] [comments]