Blancer.com Tutorials and projects
Freelance Projects, Design and Programming Tutorials
Category Added in a WPeMatico Campaign
I create a new date like this in the redux store
const foo = DateTime.now()
Then I read the date in a component
const { foo } = useSelector(state => state.settings.date)
I then try to format the date withn toLocaleString
foo.toLocaleString(DateTime.DATE_FULL, { locale: 'fr' });
Which returns [object object]. When I try this in the same place
DateTime.now().toLocaleString(DateTime.DATE_FULL, { locale: 'fr' });
I get a proper formatted date.
Why is that?
eslint is not working!
i write npm install eslint -g
and then when i trying to check eslint --version it throws an error
eslint : File C:UsersHp laptopAppDataRoamingnpmeslint.ps1 cannot be loaded because running scripts is disabled on this system.
i want to enable eslint for vs code
I am trying to add a user to the Cognito user pool. I want to mark their email as verified when creating them, I am using AdminCreateUserCommand here.
const createUserCommand = new AdminCreateUserCommand({
UserPoolId: process.env.COGNITO_POOL_ID,
Username: user.email,
TemporaryPassword: nanoid(10),
UserAttributes: [
{
Name: "email_verified",
Value: "true",
},
],
});
const createUserResponse = await this.cognitoClient.send(
createUserCommand
);
But I am getting following error:
{
“error”: {
“$metadata”: {
“httpStatusCode”: 400,
“requestId”: “0d75da0d-53f1-44e3-ba20-018c903d2f8a”,
“attempts”: 1,
“totalRetryDelay”: 0
},
“name”: “InvalidParameterException”
}
What could be the issue here?
This is my array of objects
i need to filter this with name
case one : if i search ‘tali’ filter result from startwith case, same time user enter ‘tali Co OP’ get the result ‘Taliparamba Co Op Hospital’
case two : if i search ‘ath’ get result of ‘Athikkal Saw Mill,Kallai’ and ‘Marhaba Ice Plant Atholi’ beacause Ath contain in ‘Marhaba Ice Plant Atholi’
test = [{ id: 1, name: 'Taliparamba Co Op Hospital' },
{ id: 1, name: 'Athikkal Saw Mill,Kallai' },
{ id: 1, name: 'Marhaba Ice Plant Atholi' },]
Require() of ES Module not supported while updating from Angular 12 to 13
I have updated all my packages to support Angular 13, but still after complilation in the main.js
platform-browser gets imported by require which could possibly cause this issue
Error: require() of ES Module /node_modules/@angular/platform-browser/fesm2015/platform-browser.mjs not supported.
Instead change the require of /node_modules/@angular/platform-browser/fesm2015/platform-browser.mjs to a dynamic import() which is available in all CommonJS modules.
at __node_internal_captureLargerStackTrace (node:internal/errors:477:5)
at new NodeError (node:internal/errors:387:5)
at Module.load (node:internal/modules/cjs/loader:1009:11)
at Module._load (node:internal/modules/cjs/loader:846:12)
at f._load (node:electron/js2c/asar_bundle:2:13330)
at o._load (node:electron/js2c/renderer_init:2:3109)
at Module.require (node:internal/modules/cjs/loader:1035:19)
at require (node:internal/modules/cjs/helpers:102:18)
at 7258 (main.js:1:1070126)
at r (runtime.js:1:127)
at R (main.js:1:2708253)
at main.js:1:2708270
at n (runtime.js:1:3008)
at main.js:1:57
Package.json
"dependencies": {
"@angular/animations": "~13.4.0",
"@angular/cdk": "^13.3.9",
"@angular/common": "13.4.0",
"@angular/core": "13.4.0",
"@angular/forms": "~13.4.0",
"@angular/material": "^13.3.9",
"@angular/platform-browser": "~13.4.0",
"@angular/platform-browser-dynamic": "~13.4.0",
"@angular/router": "~13.4.0",
"@grpc/grpc-js": "^1.2.12",
"angular-plotly.js": "^1.8.0",
"archiver": "^4.0.2",
"async-waterfall": "^0.1.5",
"blockly": "^5.20210325.0",
"bootstrap": "^4.5.2",
"chokidar": "^3.5.2",
"crypto-js": "^4.0.0",
"dom-to-image": "^2.6.0",
"downloads-folder": "^3.0.1",
"electron-json-storage": "^4.5.0",
"electron-log": "^4.4.1",
"exceljs": "^4.3.0",
"file-saver": "^2.0.2",
"form-data": "^4.0.0",
"google-protobuf": "^3.13.0",
"http-server": "^0.12.3",
"jquery": "^3.5.1",
"lodash": "^4.17.21",
"masonry-layout": "^4.2.2",
"moment": "^2.29.1",
"moment-timezone": "^0.5.32",
"ng-circle-progress": "^1.5.1",
"ng-click-outside": "^6.0.0",
"ngx-filter-pipe": "^2.1.2",
"plotly.js": "^2.9.0",
"resize-observer-polyfill": "^1.5.1",
"rxjs": "^6.5.3",
"rxjs-compat": "^6.6.3",
"split2": "^3.2.2",
"systeminformation": "^5.11.9",
"tslib": "^2.0.0",
"yargs": "^17.0.1",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-builders/custom-webpack": "^13.1.0",
"@angular-devkit/build-angular": "~13.0.2",
"@angular/cli": "~13.0.2",
"@angular/compiler": "~13.4.0",
"@angular/compiler-cli": "~13.4.0",
"@angular/language-service": "~13.4.0",
"@types/crypto-js": "^4.0.1",
"@types/jasmine": "~3.6.0",
"@types/jasminewd2": "~2.0.3",
"@types/lodash": "^4.14.168",
"@types/node": "^14.14.37",
"codelyzer": "^6.0.0",
"electron": "^22.2.1",
"electron-builder": "^23.1.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.6.4",
"webpack": "^5.84.1",
"webpack-node-externals": "^2.5.2"
}
I’ve got server that run the on UTC timezone, but I need to get data range on local timezone, the data have collectTime attribute that has unix timestamp. So I just need to get the start and end of day of the locale to get correct data represent this day
This is what I tried :
const { startOfDay, endOfDay, getTime, subDays } = require("date-fns");
const { utcToZonedTime } = require("date-fns-tz");
const timezone = "Asia/Jakarta";
const correctLocalStartDate = 1685379600000;
const correctLocalEndDate = 1685465999999;
const selectedUnixTime = subDays(new Date(), 1).getTime();
const localDate = utcToZonedTime(selectedUnixTime, timezone);
const localStartDate = getTime(startOfDay(localDate));
const localEndDate = getTime(endOfDay(localDate));
console.log(
{
isItCorrect: localStartDate === correctLocalStartDate,
correctDate: new Date(correctLocalStartDate),
systemDate: new Date(localStartDate),
},
"Start Date"
);
console.log(
{
isItCorrect: localEndDate === correctLocalEndDate,
correctDate: new Date(correctLocalEndDate),
systemDate: new Date(localEndDate),
},
"End Date"
);
Will return
{
isItCorrect: false,
correctDate: 2023-05-29T17:00:00.000Z,
systemDate: 2023-05-30T07:00:00.000Z
} // Start Date
{
isItCorrect: false,
correctDate: 2023-05-30T16:59:59.999Z,
systemDate: 2023-05-31T06:59:59.999Z
} // End Date
But the localStartDate (printed on systemDate) are still wrong since it’s not on the correct start of local date that I’m using. How do I get the correct unix timestamp for start and end day on locale date time?
Per Chrome Dev Tools, my total blocking time is 240ms. It is also 596ms. It is also 1212ms.
From Lighthouse:
Also from Lighthouse — same report:
And from the Performance tab, same app, same home page, moments later:
I’m sure this makes sense somehow, but I haven’t figured it out yet. Can someone explain it?
How to convert number with leading zero like 043562 to string ‘043562’?
if i use toString() it is giving me wrong output.it is working fine for number without leading zero for example : 435622.
`const number = 043562;
const number2 = 435622;
console.log(number.toString()); output: 18290, expected output : 043562
console.log(number.toString(8)); output: 43562, expected output : 043562
console.log(number2.toString()); output: 435622`
I have a query?
I want to save contact. when i click on the link which is mention in website.
how to do?
When i scan a Qr code of contact.after that the scanner open a contact app and ask to save a contact. it work both android and IOS(Apple device).
The same process,i want to without scan a code. when i click a link in browser contact app open and ask me to save a contact in mobile device.
I am doing this functionality in Python with Django Framework.
what is do to do that?
Step 1. First a QR code of contact with this website. Qr code generator
Step 2. then i select a VCARD , fill the form and submitted.
Step 3. after that it will generate a QR image code.
Step 4. then i open a mobile scanner app to scan this code.
Step 5. it will redirect and open a contact app to save this contact.
I am doing this functionality in Python with Django Framework.
what is do to do that?
#django #python #QRcode #VCARD #Conact #Javascipt #Share
I’m searching for a way for extracting common values in at least two arrays in the list of arrays in JS.
e.g. [["google", "amazon", "reddit"], ["telegram", "reddit", "discord"], ["firefox", "telegram", "chrome"]] to ["reddit", "telegram]
The point is 1. the arrays can be any length 2. common at least two (or any specified number) of arrays but not all of the arrays.
I looked a countless numbers of SO posts and also looked the lodash functions, they are all talking either “of two arrays” or “of all arrays from multiple arrays”, none of them were takling “of two/arbitrary arrays from multiple arrays”. So I’m here to ask.
Thanks.
I’ve 3 projects with Angular and I need to use all of them in another project.
I can use Microfrontend architecture and mono repository but I must add these projects to the sub-application in angular, maybe I use these apps for another project in the future.
how can I add an external app to an angular project with a command or other ways?
I have a mern stack with a payment page I want to implement google places api for an address auto complete feature in the form. I have the form figured out but I need to add this script tag in the html.
<script>
(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
key: "YOUR_API_KEY_HERE",
v: "weekly",
// Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
// Add other bootstrap parameters as needed, using camel case.
});
</script>
How am I supposed to access a process.env.API_KEY variable from within the index.html at the public part of the react app?
For example, In this text, I want to get information about the position of the word ‘nme’ in the whole text (left / top).
I need support textarea / input/div (contenteditable=”true”).
I want to get word position in text like Grammarly.
I don’t have any ideas yet.
Thank you
I’m using Three.js and React. I’m trying to display gltf object based on latitude and longitude in locations array of objects. I tried using for loop and access to each latitude and longitude and set position based on them, however only one gltf is show up on the screen. How do I add all the gltf to the scene?
My current code:
const locations = [
{ lat: 49.285804, lng: -123.119927 },
{ lat: 49.286704, lng: -123.129184 },
{ lat: 49.283365, lng: -123.100725 },
{ lat: 49.276688, lng: -123.126354 },
{ lat: 49.28101, lng: -123.11879 },
{ lat: 49.281228, lng: -123.125477 },
{ lat: 49.281603, lng: -123.110954 },
{ lat: 49.285806, lng: -123.137186 },
{ lat: 49.28407, lng: -123.113193 },
{ lat: 49.287405, lng: -123.125083 },
];
loader.load(
"/low_australian_shepherd/scene.gltf",
function (gltf) {
for (let i = 0; i <= locations.length; i++) {
gltf.scene.position.copy(
overlay.latLngAltitudeToVector3({
lat: locations[i].lat,
lng: locations[i].lng,
})
);
scene.add(gltf.scene);
}
},
);