Landing (and more) for Real Estate

TL;DR

I have launched recently a quick ebook on web version and downloadable as PDF as well.

Also a simple waiting list.

But most importantly, is to have a happy real estate client:

DM - Real Estate Official Site

A Real Estate Business Site for Spain

Intro

Ive been playing quite a lot with PB and quick astro themes lately.

I could not waste the opportunity to make some tech upgrades for a friend.

Specially since I could get Strapi and PayloadCMS working within containers:

There are tons of CMS.

Some of them I have pending to try.

But…to get one working is not that easy.

#ssh
git clone https://github.com/JAlcocerT/obfuscate #git pull
cd obfuscate && make up-external #make build #make restart
#sudo docker network ls
#docker network connect cloudflared_tunnel book-publisher-api

DIY Website eBook

JAlcocerTech DIY Series | Ebook to create a Website for your brand

Because in the end, having a website is a matter of:

1. How much you really need it? - Aka, will you earn money>costs with it?
2. Knowledge - Do you know how to make one? if now, can you learn how to do it quick?
3. Ultimately, how much are you willing to pay for it? Or better said, how much you asses your $/h rate compared to others?

Plot twist, if you claim to earn a lot of money and also claim to have clients, you wont mind to pay interesting $/h rates to others to build it for you. Would you?

Yea, I liked the DIY vs DWY vs DFY model :)

The Stack

After starting more than one year ago with this repository and post as a concept for real estate.

The Stack: NEXTjs WebApp + 1 Welcome Page + Theme directory where the properties are stacked.

And…the skill: knowing to vibe code.

In the mean time, there have been some ad-ins to the project that can also be interesting for builders and business owners.

The Waiting2Landing v2 PB Post

I tinkered here more with CSR and linkhub than actually building the waiting2landing v2 with PB instead of formbricks as per v1

NEW repository - Simple Waiting List

NextJS + CapJS = Working Waiting list to CSV with no external APIs

#ssh
git clone https://github.com/JAlcocerT/simple-waiting-list #git pull
cd simple-waiting-list && make up-external #make build #make restart
#sudo docker network ls

Create a simple waiting list based on nextjs and a cool and modern UI, including a dockerfile and docker-compose.yml that will control the title, description, and other variables via environment variables and will save the email leads to a JSON.

When a user is added it will say "Thank you for your interest" and will redirect to the landing page.
If a user email is already added, it will say we already have your email.

git init
git branch -m main
git config user.name
git config --global user.name "JAlcocerT"
git config --global user.name
git add .
git commit -m "Initial commit: Starting simple waiting list"

#sudo apt install gh
gh auth login
gh repo create simple-waiting-list --private --source=. --remote=origin --push
    
#git init && git add . && git commit -m "Initial commit: Starting simple waiting list" && gh repo create simple-waiting-list --private --source=. --remote=origin --push

make help
# Available commands:
#   make dev                - Run development server
#   make container          - Run in Docker container
#   make view-leads         - View all leads from leads.json
#   make export-csv         - Export leads to CSV

New Theme

I could have proposed a combination of :

Moi Real Estate

Source Code Astro x Flask as CMS

Astro Payroll x PB SDK

Source Code of Astro with login auth via Cloudflare Workers

1. Simplifcation of the Astro Payroll Theme, that I forked here

2. The gallery look and feel from the previous version source code at ./real-estate-moi/ScrewFastMoiRealEstate. Commented here, as I tried to combined FlaskCMS x the Astro theme.

git clone https://github.com/JAlcocerT/real-estate-moi
cd moirealestate-astro-theme

#npm run dev -- --host 0.0.0.0 --port 4321
#sudo docker-compose up -d astro-dev

What this could have been:

#git clone --recurse-submodules https://github.com/JAlcocerT/moi-realestate-pb.git
# or, after a normal clone:
#git submodule update --init --recursive

Now here we have the old working screw fast with photo gallery: ./moi-realestate-pb/submodules/real-estate-moi/ScrewFastMoiRealEstate

You just need to run it and go to http://localhost:4321/property/

NEW - Real Estate Landing x PB SDK Gallery

Source Code of Astro + PB for Real Estate

But instead: I vibe coded a full stack nuxt web app so that I can forget about CMS and just edit the content via the web app.

Obfuscate | DIY Website eBook

Source Code of Astro with login auth via Cloudflare Workers

NEW | Real Estate NUXT

Source Code of a Nuxt WebApp for Real Estate + Galleries + editable

I just followed this steps to initiate the repo programatically and push it with gh: https://github.com/JAlcocerT/al-estate-nuxt-moi

git init
git branch -m main
git config user.name
git config --global user.name "JAlcocerT"
git add .
git commit -m "Initial commit"

#sudo apt install gh
gh auth login
gh repo create real-estate-nuxt-moi --private --source=. --remote=origin --push

I brought the repos as submodules 101, for the first time ever:

git status
git submodule status
git remote -v

So to use this real estate webapp in the future:

git clone

So…how is this going to actually work?

Nuxt For Real Estate

Because we need:

1. A full stack web app modern lookingwith NUXT for a real estate agency: consisting of a landing page like https://dm-real-estate.com/ with a faq included and a section where the properties are listed like https://dmproperties.web.app/blog/ and each of them can be expanded to show the details of the property
2. Inside the details of the property, there will be text description and a cool Gallery
3. A Login System with unique hardcoded authentication
4. Once logged in, the user can edit the content of the landing page, the faq and add/remove property and its details the properties
5. Add the Makefile with a install dev and prod commands plus help so that i can run it
6. Provide capabilities to have a favicon and a OG image when the root or blog are shared and a main photo of the property when one particular one is shared
7. There should be routes for: / for /properties and for /access to provide access to /manage where the content can be edited

I took those and used Gemini for some refinement

Then created a brd.md and told Antigravity to check for gaps, then create a z-development-plan.md

Optional

• Cloning sample content with scrapping + image download + openAI
• CapJS to avoid bots included

After the first iteration:

git clone https://github.com/JAlcocerT/real-estate-nuxt-moi.git
#make help
#make dev

Which will also bring via the admin panel when we input a hardcoded password from the .env

The funny thing is that…after a while thinking:

1. The go to properties and associated WYSIWYG editor was not in place
2. The site configuration via JSON was also not in place
3. The site look and feel was decent though

So…for further iterations, id just keep it with NextJS.

Validate the Website

Conclusions

See the difference with a cool (but no so fast) website.

Im sure that this website works, because their service is great.

But if people dont know you or you are starting a brand: you better make it easy for people to like you.

Anyways, building a brand is not easy.

But if you have one, it should not be a problem to start your consultation services.

Tech Consulting

Let’s discuss your tech needs

As I see it now:

graph TD
    A[www.jalcocertech.com] --> B(blog/YT 0$);
    A --> C(DIY 0/$);
    A --> D(Consult via Cal.com - DWY $$);
    A --> E(Services - DFY $$$);

Oh, and the blog will writings will be continued on >2026 into some branded blog.jal....com

This will be kept as a full tinkering.

On the blog will be more curated and on the official www site the success stories.

And bc as if we are out of sight, we are out of mind we have to make our services known somehow.

Including the dirty ads.

Outro

Buying a house is a big decision.

Specially with these salaries and prices:~250k a flat vs 25k/y household income

But at least now you can decide in advance where to look:

• https://www.viviendasylocalesgranada.com/ficha/piso/granada/zaidin/4348/27213492/es/
• https://www.ine.es/ADRH/?config=config_ADRH_2023.json&showLayers=ADRH_2023_Renta_media_por_hogar_cache&level=5

When you are trying to do business with people with interesting amount of assets, they tend to measure the value of your offer in $ per hour that you will save them.

Think that some business owner can have huge ARR plus stocks providing dividends.

Just Remember that your solution should give them more (»>) than their PassiveIncome ($)/ 1700 h in a year

From the doing side, some who trade time for money with a good tech job, will not go lower than 100k$/1700h ~$60/h.

So hopefully, the matching is between a person with business who needs something to earn more, on the scale of >300k ARR that can afford to spend those >60$/h = 10k$/month/person (a ~3% of their ARR) on tech expertise to make their business better.

Get customers via Ads

If you have something to offer but no clients, you better have a good website and a good ad campaign.

As you can imagine, a business its a constant fight between supply and demand.

Have something to supply, rise demand, then rise again your ability to supply by getting efficient etc.

Get customers via a sales pipeline

Lets say, for example, with Apify which is one of the very interesting APIs available nowadays.

Your journey with lead generation can start here: https://apify.com/store/categories/lead-generation

Copy Paste Plugins for Webs

If what you need are leads, look no further than Apify. As I covered here.

But your business might need some automation: which n8n can do

Or some email subscriptions: which MailerLite can do

N8N

With the right knowledge, you can use n8n to do all the automations you need and avoid paying similar software or doing the work manually.

Use n8n on your server with just 1min tutorial:

Build n8n workflows: https://n8nworkflows.xyz/?price=free

Just…try things.

n8n 101 Post

Using n8n across few use cases

Because most of the software around, like n8n and wordpress are free to use.

Master a thing and help others!

That level of focus is what platforms like elestio achieve: https://elest.io/open-source/n8n

MailerLite

If you have an audience and are interested to bring email subscriptions to your website, MailerLite is a good option.

<!-- MailerLite Universal -->
<script>
    (function(w,d,e,u,f,l,n){w[f]=w[f]||function(){(w[f].q=w[f].q||[])
    .push(arguments);},l=d.createElement(e),l.async=1,l.src=u,
    n=d.getElementsByTagName(e)[0],n.parentNode.insertBefore(l,n);})
    (window,document,'script','https://assets.mailerlite.com/js/universal.js','ml');
    ml('account', 'some_acount_id');
</script>
<!-- End MailerLite Universal -->

<a class="ml-onclick-form" href="javascript:void(0)" onclick="ml('show', 'some_id_here', true)">Click here to show form</a>

and use it with your components, for example
<form id="simple-newsletter-form" class="input-container" method="post" action="javascript:void(0);" onsubmit="ml('show', 'some_id_here', true); return false;">
    <input type="submit" value="Ready to Know?" class="ml-onclick-form" style="appearance: button; -webkit-appearance: button; cursor: pointer;">
</form>

Making Website Services Known

I was recently having a walk and saw several designers advertising their services on the street.

With the typical “I can design your website” printed with a cool logo.

Creating these and print them should not be a problem as you can master the power of PDFs /reports / infographics and QR codes as a code.

This marketing strategy even has a name: guerrilla marketing

The prices?

They were mentioned at ~1500$.

With a waiting time from 3 days to 4 weeks: I guess it depends on how their backlog / sales pipeline goes

1. https://websitebastler.at/preise/
2. https://bscwebdesign.at/en/services/
3. Others dont put prices though: https://hastastudio.com/projekty/kaze-habitat/

Wow, 1500/(8*3) = ~65$/h that we mentioned before.

Kaboommmm 🤯

In other european countries, what I see more and more is that behind every website, there is some kind of gov funding: https://organizate.info/

They have a ~2008 design vibe though, see an example