Posts

Showing posts with the label Free Code

LLMs.txt Generator for Geographic AI

Image
Hey all! 👋 I've created an NPM package called  llms-txt-generator-geo-ai  that automatically generates  llms.txt  files for your projects. This is particularly useful for: AI Training Control : Setting policies for how AI models can use our content Geographic Context : Adding location-specific information to our projects Compliance : Managing data collection and usage permissions SEO & Crawlers : Controlling how different bots interact with our content Why do we need llms.txt files? Similar to how  robots.txt  controls web crawlers,  llms.txt  files help us: Control which parts of our content AI models can train on Set clear attribution requirements Specify geographic context for location-based applications Define data usage policies for co...

Creating a Responsive Image Component in Next.js with TypeScript

Image
In this tutorial, we'll create a  ResponsiveImg  component that uses the Next.js Image component for optimized  image  rendering.   Introduction The ResponsiveImg Component The ResponsiveImg component accepts properties for both mobile and desktop versions of the image. It uses the useEffect and useState hooks to determine the screen size and adjust the image properties accordingly. Here's the complete code for the ResponsiveImg component: /**  * ResponsiveImg component that renders an image which adapts to screen size.  * It uses the Next.js Image component for optimized image rendering.  *  * @component  * @param {ResponsiveImgProps} props - The properties for the ResponsiveImg component.  * @param {Object} props.mobile - The properties for the mobile version of the image.  * @param {string | StaticImport} props.mobile.src - The source of the mobile image.  * @param {number} props.mobile.width - The width of...

How to create a security ASP.NET Web API controller

 Hi, Here is a code that has base response class and use it in an ASP.NET Web API controller to send a response with a cookie and security headers. This code creates a BaseResponse<T> class with a Status property and a Data property of type T. In the Post method of MyController, a new HttpResponseMessage is created with a status of OK and the content set to a serialized BaseResponse<string>. A cookie is added to the response headers, and then several security headers are added. The X-Content-Type-Options header is set to nosniff to prevent the browser from trying to interpret content with a MIME type that doesn't match the declared type. The X-Frame-Options header is set to SAMEORIGIN to prevent the page from being displayed in a frame or iframe. The Content-Security-Policy header is set to only allow content from the same origin In this code, I've assumed that you have a service IDatabaseService with a method CheckIfExists that checks if an ID exists in the databa...

React lazy component (import component)

Image
Let's face it - there are some problems with React & Webpack. When I create a Webpack bundle - All the files (js and css) are merged. (remember files Name Must Start with Capital letter- js , css,..) It means that if I have some styles with the same name, the style will be applied on all the elements. Ex: In A component - there is an element like this: <Button className="mybutton" label="close" /> with style like this: .mybutton {color:red} In B component - there is element with the same class name <Button className="mybutton" label="open" /> So because I used the same style css class name - the Webpack bundle merged the css files of all the components, its means that we got red color to all components that use the same name. In the example component B got red color for the button. I call it a bug (not a feature 😀) In my project I created an app.js. In this file I import all the components. There, I noticed that as I mentione...