DEV Community: Gem Cloud

Net Core postgreSQL connection string on windows 10

Gem Cloud — Sun, 01 May 2022 05:38:04 +0000

Prepare knowledge:

The file “pg_hba.conf” control whether password or not:

Find server port number at pgAdmin4:
Restart PostgreSQL server:
typing “services.msc” on Run and Enter key.

config password Steps:

find the file pg_hba.conf;
Back it up;
place the following line

local all all trust

restart your PostgreSQL server
you can now connect as any user. Connect as the superuser postgres

>psql -p 5433 -U postgres

Reset password ('replace my_user_name with postgres since you are resetting postgres user)

ALTER USER my_user_name with password 'my_secure_password';
ALTER USER postgres with password 'pass@2022';

Restore the old pg_hba.conf as it is very dangerous to keep around
Restart the server, in order to run with the safe pg_hba.conf.

Result:
The ConnectionString is "Host=localhost;Port=5433;Username=postgres;Password=pass@2022;Database=dvdrental;";

Dos Commands:

>cd C:\Program Files\PostgreSQL\14\bin>
>psql -p 5433 -U postgres
postgres=# ALTER USER postgres with password 'pass@2022';

It worked!
The end!

Integrating Tailwind into an ASP.NET Core Project

Gem Cloud — Thu, 21 Apr 2022 04:09:51 +0000

We use Visual Studio 2022 Community.
You can find out codes at Gem.NetTailwind

1. Create ASP.NET Core 6.0 empty web application:

and add razor page structure.

2. Add npm support to our project: The file "package.json" added into our project.

3. Install tailwind by "Package Manager Console":

PM> cd Gem.NetTailwind
PM> npm install -D tailwindcss cross-env
PM> npx tailwindcss init

The "node_modules" was installed.
The "tailwind.config.js" file was created.

4. To config the tailwind:

update the tailwind.config.js file to include all your .razor and .cshtml files.
create the Tailwind input stylesheet Styles\input.css

@tailwind base;
@tailwind components;
@tailwind utilities;

Finally, update the package.json file to add this script section:

"scripts": {
    "tailwind": "cross-env NODE_ENV=development ./node_modules/tailwindcss/lib/cli.js -i ./Styles/input.css -o ./wwwroot/css/output.css --watch"
  },

5. Add Tailwind.Extensions.AspNetCore into our project;

to install the Tailwind AspNetCore NuGet package.
to Program.cs and add this code before app.Run();
if (app.Environment.IsDevelopment())
{
app.RunTailwind("tailwind", "./");
// or
app.RunTailwind("tailwind", "../Client/");
}
add this using statement on Program.cs
using Tailwind;

6. Integrating NPM into an ASP.Net Core project to use the "MSBuild"

and modify your *.csproj file.

<PropertyGroup>
 ...
 <NpmLastInstall>node_modules/.last-install</NpmLastInstall>
</PropertyGroup>
...
<!-- Check whether npm install or not! -->
<Target Name="CheckForNpm" BeforeTargets="NpmInstall">
 <Exec Command="npm -v" ContinueOnError="true">
  <Output TaskParameter="ExitCode" PropertyName="ErrorCode" />
 </Exec>
 <Error Condition="'$(ErrorCode)' != '0'" Text="You must install NPM to build this project" />
</Target>

<!-- install package.json package auto "node_modules" -->
<Target Name="NpmInstall" BeforeTargets="Compile" Inputs="package.json" Outputs="$(NpmLastInstall)">
<Exec Command="npm install" />
<Touch Files="$(NpmLastInstall)" AlwaysCreate="true" />
</Target>

Next step we will add Theme features into our project.
stay tune!

Invalid href passed to next/router on"next": "12.0.7"

Gem Cloud — Mon, 24 Jan 2022 20:36:16 +0000

Environment:

Windows 11
"next": "12.0.7"
TypeScript ( Js should have same issue).
Dynamic router link

I met an error "
: \, repeated forward-slashes (//) or backslashes \ are not valid in the href", which always shown on VScode & web browsers!

The root cause is that I joined "/" with my each url string when I generate dynamic links. (nextjs V9 looks should do it!)



href: join('/', slug),



slugRoot = "/"
slugAbout = "/about"

Solution: Do NOT add "/" on head of your url string, and then add "/" on your tag.



// href: join('/', slug), 
href: slug,



slugRoot = ""
slugAbout = "about"



// <Link href={`/${yourPath}`} ></Link>
<Link href={`/${href}`} key={href} prefetch={false} passHref>

Happy Coding!

cross-env for front-end (Nextjs) on Windows 10 11

Gem Cloud — Wed, 29 Dec 2021 17:48:53 +0000

If you are doing front-end projects on windows 10 or 11.
specially, you want to run some of sample codes from GitHub!
Do not forget to install "npm i cross-env" on your project.

> npm i cross-env

The "cross-env" helps us save a lot of time. otherwise the codes threw errors!
for example:

read some of files from folder (markdown for blog etc.) on Nextjs
use "NODE_ENV=development" on project.json, see below command about lingui.

    "__NoWorkOnWindow_lang:extract": "NODE_ENV=development lingui extract --clean",
    "lang:extract": "cross-env NODE_ENV=development lingui extract --clean",

Happy Coding!

To use yarn at VS-code on Windows 11

Gem Cloud — Tue, 07 Dec 2021 06:19:59 +0000

install yarn on windows 11.
https://www.liquidweb.com/kb/how-to-install-yarn-on-windows/

Download the Yarn .msi installer
and installed it on windows 11.
Yarn commands for VSCode
https://www.npmjs.com/package/vscode-yarn
install vs-code extension.

Happy coding!

Say Hello Dev.to

Gem Cloud — Fri, 03 Dec 2021 19:29:57 +0000

I joined here on Dec. 03 2021.
This is my testing Post.

Thanks everyone!