|
How do you guys incorporate locally hosted fonts into site build processes? (And what formats do you use?) I'm using Laravel Mix as part of a build, wanted to just leave fonts in the /public directory with the images, but when webpack/postcss gets the to the font-face in my CSS it tries to resolve the URLs and breaks on me. Not sure if I'm just missing loaders/steps, or if I should be working off a different structure altogether.
|
#
?
Jan 31, 2021 19:52
|
|
|
|
| # ? May 19, 2024 07:35 |
|
|
Building a marketing site built in nextjs deploying to netlify. I don't really want to track assets in git, what is the normal solution for managing assets?
|
|
#
?
Feb 2, 2021 13:19
|
|
|
Like content images in a hard-coded website? I put them in the repo
|
|
#
?
Feb 2, 2021 14:25
|
|
|
git-lfs?
|
|
#
?
Feb 2, 2021 14:31
|
|
|
prom candy posted:Like content images in a hard-coded website? I put them in the repo ya i can do this now but im thinking eventually id like to move away from that smackfu posted:git-lfs? this is neat
|
|
#
?
Feb 2, 2021 14:36
|
|
|
Is there honestly no simple way to hook into the 'back' button in an Angular SPA? I just want to say "oh hey you got to the page from the back button? OK do foo() oh you got here some other way, do bar(). However anything I see, outright doesn't work because of Angular API changes, or requires a subscription, which I guess sometimes never returns anything so neither foo() nor bar() happen and the whole page breaks. Basically page A has content that is populated onScroll, but the user case is going to page B then BACK TO A, but the scroll position isn't maintained partially because not saved, but also because the content isn't there. EDIT I guess I can put a hostlistener on the app and then subscribe to that? The Merkinman fucked around with this message at 01:04 on Feb 4, 2021 |
|
#
?
Feb 3, 2021 20:10
|
|
|
The Merkinman posted:Is there honestly no simple way to hook into the 'back' button in an Angular SPA? I just want to say "oh hey you got to the page from the back button? OK do foo() oh you got here some other way, do bar(). However anything I see, outright doesn't work because of Angular API changes, or requires a subscription, which I guess sometimes never returns anything so neither foo() nor bar() happen and the whole page breaks. Going back to my older project with Vue, seems like even the 4th version no longer works now? I Guess I didn't actively touch it for every dependency that npm has so now it just magically broke. Guess I'm back to square 1 and just telling my employer "welp I guess want I want is literally impossible since I've scoured the internet and cannot find a single working example of both publishing a library and using it that actually works in TYOOL 2021" AlphaKeny1 did you ever get something that actually worked? AND I did quote != edit. Maybe I'm just too inept to use computers at all!
|
|
#
?
Feb 15, 2021 18:21
|
|
|
Not sure about the back button on angular, but I know vue you can detect that sort of thing. You could listen to the `pageshow` event, apparently the value of `persisted` will tell you that it was because of the back button? I'm not sure, it's probably used for something other than that. https://developer.mozilla.org/en-US/docs/Web/API/Window/pageshow_event Vue broke for me once, it was a process to get it up to date since the latest versions no longer supported anything but awful awful webpack for building. So I had to change all of the tooling along with upgrading the application. I feel your pain re npm it's not just you.
|
|
#
?
Feb 15, 2021 18:27
|
|
|
Any React devs currently using ant-design might want to start planning an exit strategy. Their GitHub repo was deleted without warning over the weekend, and it is now hosted exclusively on the CCP-funded gitee.
|
|
#
?
Feb 15, 2021 20:27
|
|
|
Full Circle posted:Any React devs currently using ant-design might want to start planning an exit strategy. Their GitHub repo was deleted without warning over the weekend, and it is now hosted exclusively on the CCP-funded gitee. GitHub is owned by Microsoft and works (worked?) with ICE so like... there's no ethical version control under capitalism.
|
|
#
?
Feb 15, 2021 20:59
|
|
|
prom candy posted:GitHub is owned by Microsoft and works (worked?) with ICE so like... there's no ethical version control under capitalism. That's a fair point. I'm more skeeved out by the repo going up in smoke without warning than where it ended up hosted.
|
|
#
?
Feb 15, 2021 21:01
|
|
|
Full Circle posted:Any React devs currently using ant-design might want to start planning an exit strategy. Their GitHub repo was deleted without warning over the weekend, and it is now hosted exclusively on the CCP-funded gitee. We were very close to using Ant for a new project at work but ultimately ended up going with ElasticUI for various reasons, looks like we may have dodged a bullet (or perhaps Ant would've actually been the prefect choice, as the project's name acronym just happens to be CCP). Also strange that their data visualization libraries (AntV) are still up on GitHub. e: apparently the Ant D repo was just hacked?
|
|
#
?
Feb 15, 2021 21:25
|
|
|
The functional programming thread is long locked, anyone here have work experience with Elm or Purescript? I've dicked around with Elm in my free time, but haven't used it at work. Transitioning to a new job at a small shop and wondering if it's worth trying to introduce one of them.
|
|
#
?
Feb 17, 2021 00:38
|
|
|
Is there a good tool for making sure my html document is in order? I use a combination of google's lighthouse and a front end checklist, but i didnt know if there was something better e: btw for managing assets i went with cloudinary
|
|
#
?
Feb 25, 2021 14:19
|
|
|
You mean like HTML validation? W3C has a validator: http://validator.w3.org That’s just the one for HTML. The page links to others. Question of my own: is there a better way of learning the intricacies of WebPack beyond reading the docs and Googling poo poo? Would taking a course help? I’m trying to fix a bad and horrible webpack configuration (made by yours truly) because it is slowing me down because it doesn’t do poo poo automatically and I have to manually rebuild and I finally have some time to unfuck it (or do it over).
|
|
#
?
Feb 25, 2021 17:15
|
|
|
Is there an idiot's guide to AWS? Or a translation for their service descriptions? Scrolling through pages of near identical paragraphs trying to tell an EC2 from a Lightsail and remember what an S3 is and there's a Code Pipeline which is different fron Code Deploy and they've got the absolute worst interface for all of this. I've never felt worse for DevOps, or for the fact my company has no DevOps people. barkbell posted:Is there a good tool for making sure my html document is in order? I use a combination of google's lighthouse and a front end checklist, but i didnt know if there was something better
|
|
#
?
Mar 3, 2021 20:09
|
|
|
VagueRant posted:Is there an idiot's guide to AWS? Or a translation for their service descriptions? Scrolling through pages of near identical paragraphs trying to tell an EC2 from a Lightsail and remember what an S3 is and there's a Code Pipeline which is different fron Code Deploy and they've got the absolute worst interface for all of this. Something like https://expeditedsecurity.com/aws-in-plain-english/
|
|
#
?
Mar 3, 2021 21:11
|
|
|
i love this fire the amazon marketing department
|
|
#
?
Mar 3, 2021 22:12
|
|
|
marumaru posted:i love this What, this guy?  I always laugh out loud when I scroll to the bottom of an AWS blog post, he just looks so goddamn goofy.
|
|
#
?
Mar 3, 2021 23:06
|
|
|
marumaru posted:i love this Actually their marketing department is very good and will write reams and reams of information targeted at purse holders to convince them to spend money. However... Their developer documentation is poor for beginners, it skips that gap where it's like okay, I want the high level spiel but low level enough to be useful to a dev. Every time I find a new AWS service and want to find more about its applicability to us as a team, I wind up having to look for information on third party sites. I love AWS don't get me wrong, and their documentation isn't by any stretch "awful" or "poo poo", it just has this gap.
|
|
#
?
Mar 4, 2021 11:03
|
|
|
minato posted:What, this guy? Looks like Patton Oswalt lost some weight and dyed his hair purple
|
|
#
?
Mar 4, 2021 22:20
|
|
|
I'm glad I went bald so that I could skip having an old man reconnecting to his punk roots by dyeing his hair again phase. There is no way I would have been able to dodge that bullet.
|
|
#
?
Mar 4, 2021 23:10
|
|
|
I prefer to keep a bunch of constants like colors, fonts and what not in its own js file, that I then import the different values from when creating new components. This is super easy when I use styled-components in a js file. But is there an easy way to import them into a scss file?
|
|
#
?
Mar 15, 2021 13:28
|
|
|
uncle blog posted:I prefer to keep a bunch of constants like colors, fonts and what not in its own js file, that I then import the different values from when creating new components. This is super easy when I use styled-components in a js file. But is there an easy way to import them into a scss file? Just put the constants straight into an scss file and then import that file into the component stylesheets? Are you using straight SASS or a CSS-in-JS solution? If it’s the former I can help (because I write stylesheets and refuse to let JavaScript into yet another place it doesn’t belong, in my opinion).
|
|
#
?
Mar 15, 2021 14:23
|
|
|
Having major problems with a GML2 WFS call in Openlayers using npm. Ive tried using this same code with GeoJSON on a different dataset and it just worked. However when I tried with GML I am running into a wall. Now trying GML2 I get no errors, but it also doesnt seem to be reading much? var vectorSource = new VectorSource({ format: new GML2(), url: function (extent) { return ( 'https://arealinformation.miljoeportal.dk/gis/services/DAIdb/MapServer/WFSServer?' + 'request=GetFeature&service=WFS&typename=dmp:BES_NATURTYPER&outputFormat=GML2&' + 'SRsname=EPSG:25832&' + 'bbox=' + extent.join(',') + ',EPSG:25832' ); }, strategy: bboxStrategy }); var vector = new VectorLayer({ source: vectorSource, style: new Style({ stroke: new Stroke({ color: 'rgba(0, 0, 255, 1.0)', width: 2, }), }), }); var raster = new TileLayer({ source: new OSM({ url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png' }), }); var map = new Map({ layers: [raster, vector], target: document.getElementById('map'), view: new View({ center: [55.5, 11.5], maxZoom: 19, zoom: 15, }), }); The datasource is from Denmark and when I put the URL into a browser I get a XML document reponse, but I get no features showing up on my map. This is what the object looks like in console for GML2. https://imgur.com/vpoVqk4 And this is the error image for GML3 https://imgur.com/M91KGSw example GML3 URL: https://arealinformation.miljoeport...3886,EPSG:25832 WARNING: 50 MB the GML3 error seems to be about it being unable to read it? I am setting this up on a localhost so I have no idea if there could be any kind of error due to me not having proper channels or something like that? This is my first ever attempt at setting up WFS features on a webmap.
|
|
#
?
Mar 19, 2021 18:34
|
|
|
uncle blog posted:I prefer to keep a bunch of constants like colors, fonts and what not in its own js file, that I then import the different values from when creating new components. This is super easy when I use styled-components in a js file. But is there an easy way to import them into a scss file? CSS variables?
|
|
#
?
Mar 19, 2021 18:50
|
|
|
Buller posted:Having major problems with a GML2 WFS call in Openlayers using npm. Post your code in a GitHub gist or something and I can take a look
|
|
#
?
Mar 20, 2021 01:50
|
|
|
Chenghiz posted:Post your code in a GitHub gist or something and I can take a look https://github.com/Khorstaau/WFShelp
|
|
#
?
Mar 20, 2021 16:45
|
|
|
So I had some issues and had to update Parcel, but this displayed a map for me. It's really zoomed in at 0,0 which is ocean so you have to zoom out a ways to see anything. What are you expecting to see?
|
|
#
?
Mar 21, 2021 19:20
|
|
|
Chenghiz posted:So I had some issues and had to update Parcel, but this displayed a map for me. It's really zoomed in at 0,0 which is ocean so you have to zoom out a ways to see anything. What are you expecting to see? I want to get WFS features to show up when Im zooming in on Denmark. As you can see in the new GML2 call. It doesnt give me an error but it also doesnt create features and I dont know why.
|
|
#
?
Mar 21, 2021 20:09
|
|
|
I am trying to use React as the UI for my game made with PixiJS. Currently I am using this https://github.com/odrick/webpack-free-tex-packer to create a spritesheet from my images, as part of my webpack build process. This works fine, I am able to import the spritesheets json file in PixiJS and it finds the image etc. Basically this webpack plugin puts sheet.json and sheet.png in my assets folder when I build. My issue is that I want to use the images in the React part as well. This plugin is able to generate a .css file for the spritesheet, which shares the same spritesheet image and would be great to use for the React part. Problem is that I can't seem to find any way to actually import the generated .css file, since it's created during the build, I am not really sure how I would reference it. When I use it in PixiJS I just reference it like this code:
|
|
#
?
Mar 21, 2021 20:10
|
|
|
Sistergodiva posted:I am trying to use React as the UI for my game made with PixiJS. You probably know this bit already, but to use css in React you generally just do: JavaScript code:
|
|
#
?
Mar 23, 2021 14:54
|
|
|
Sistergodiva posted:I am trying to use React as the UI for my game made with PixiJS. The difference between Pixi and React is that Pixi is getting the stylesheets at runtime, whereas with React any CSS you import gets integrated at the build so the CSS has to be there then. That said I don't think you have to import the css into React, if you can load the CSS globally then it should (I believe) work on elements built by React... all that React import is doing is obfuscating the CSS a bit to make it unique to that file. Or get webpack to build that CSS before it runs React. You could split your build into two webpack runs (one to make the CSS, and one to package everything). Alternatively look at your loader order in your config; the loaders are run from last to first, but I don't know whether webpack uses that order to load the files, or if it's run to resolve files that webpack loads in its own order.
|
|
#
?
Mar 23, 2021 15:22
|
|
|
dupersaurus posted:if you can load the CSS globally then it should (I believe) work on elements built by React This does work and is by far the simplest solution.
|
|
#
?
Mar 23, 2021 17:44
|
|
|
Thanks! I imported it in the index html and it worked. I tried it before but tried the wrong className it parsed the .png as a new class so I had to add that as well.
|
|
#
?
Mar 24, 2021 11:41
|
|
|
Sistergodiva posted:Thanks! I imported it in the index html and it worked. I tried it before but tried the wrong className it parsed the .png as a new class so I had to add that as well. Just be warned that you could be seriously increasing your initial load size, so be careful about that.
|
|
#
?
Mar 24, 2021 12:49
|
|
|
dupersaurus posted:Just be warned that you could be seriously increasing your initial load size, so be careful about that. Yeah. This is a game where I do the ui in react and the actual game in PixiJS. Since there seems to be no decent ui lib for pixi. Instead of sending base64 from the games sprite sheet to the ui, I get it to create the sprite sheet with both a json for pixi and a .css for the react part, using the same png. So when you pick up an item I can just set the class of a div to the name of the item in the sprite sheet to show the item in the react inventory.
|
|
#
?
Mar 25, 2021 08:34
|
|
|
So i'm an old that's probably 10 years behind when it comes to modern web development. I have an idea for a little project that i'm inclined to just build using HTML, CSS and Javascript, but thought maybe there's a reason to use it as an excuse to check out some more modern frameworks/workflows. There's so many places to start it's a little daunting, but maybe someone could recommend something? I wanted to mock up a page to help you choose a bag for photo gear. Basically the top of the page would have a form where you could enter the height/width/depth of your camera. From this we'd calculate the volume of the camera. The lower part of the page would then load a list of bags that could contain that size camera. The list of bags wouldn't be dynamic or anything, it'd just be a json array or something with a 'volume' attribute, we'd just want to load any bags that were larger than what you list in the form. It's nothing crazy, so is even trying to use a modern framework overkill? I started looking at next.js, is that a good place to start as any?
|
|
#
?
May 11, 2021 22:19
|
|
|
I’d probably go with vanilla js for a project like that. But realistically use whatever will make it easier/more fun for you to finish the project.
|
|
#
?
May 11, 2021 22:21
|
|
|
|
| # ? May 19, 2024 07:35 |
|
|
If you want to learn a modern framework it's as good a project as any. That said, not sure Next.js makes a ton of sense for a simple single page app like that. Do you know React already? Next is really a React framework; would make more sense IMO to focus on learning just React first. Look up the React docs and make a simple app using create-react-app.
|
|
#
?
May 11, 2021 22:24
|
|
