Majhi Ai Code Builder – Instantly Generate HTML, CSS & JS from Simple Prompts
byWorld class free tools use any one-
Majhi ai Code Builder
Majhi ai Code Builder
Majhi ai Code Builder: Turn Your Ideas into Code, Instantly.
Describe your web component in plain language, and let our advanced AI write the HTML, CSS, and JavaScript for you. The future of web development is here.
Generated Code
Live Preview
\`\`\`
`;
try {
const response = await fetch(`https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash-latest:generateContent?key=${API_KEY}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
contents: [{
parts: [{
text: fullPrompt
}]
}],
}),
});
if (!response.ok) {
const errorData = await response.json();
console.error('API Error:', errorData);
throw new Error(`API request failed with status ${response.status}: ${errorData.error.message}`);
}
const data = await response.json();
let generatedCode = data.candidates[0].content.parts[0].text;
// Extract code from markdown block
const match = generatedCode.match(/```html\n([\s\S]*?)\n```/);
if (match && match[1]) {
generatedCode = match[1];
} else {
console.warn("Could not find a markdown HTML block. Displaying raw response.");
}
typewriterEffect(generatedCode);
} catch (error) {
console.error('Error generating code:', error);
codeEditor.textContent = 'Error generating code. Please try again later. ' + error.message;
generateButton.textContent = 'Generate Code';
generateButton.disabled = false;
}
});
let typewriterIndex = 0;
let typewriterContent = '';
let typewriterInterval;
function typewriterEffect(code) {
typewriterIndex = 0;
typewriterContent = code;
codeEditor.textContent = '';
clearInterval(typewriterInterval);
typewriterInterval = setInterval(() => {
if (typewriterIndex < typewriterContent.length) {
codeEditor.textContent += typewriterContent.charAt(typewriterIndex);
codeEditor.scrollTop = codeEditor.scrollHeight; // Scroll to bottom
typewriterIndex++;
} else {
clearInterval(typewriterInterval);
updateLivePreview(typewriterContent);
generateButton.textContent = 'Generate Code';
generateButton.disabled = false;
}
}, 10); // Adjust typing speed here (milliseconds per character)
}
function updateLivePreview(code) {
livePreview.srcdoc = code;
}
copyButton.addEventListener('click', () => {
navigator.clipboard.writeText(codeEditor.textContent).then(() => {
alert('Code copied to clipboard!');
}).catch(err => {
console.error('Failed to copy code: ', err);
alert('Failed to copy code.');
});
});
