Posty

[Angular|Node.js] Wysyłanie wiadomości e-mail

W celu wysłania wiadomości e-mail z aplikacji Angular potrzebny będzie backend, który obsłuży wysyłkę. Można skorzystać z zewnętrznych usług np. EmailJS lub obsłużyć wysyłkę maila w Node.js. W tym wpisie popracujemy nad tą drugą możliwością. Node.js, Express i Nodemailer Utwórz nowy projekt `email-sender` i zainstaluj niezbędne moduły: nodemailer , cors i body-parser : npm install nodemailer cors body-parser Jeśli nie masz zainstalowanego frameworka Express , również go zainstaluj. Utwórz aplikację mailer.js obsługującą wysyłkę maila: const express = require('express'); const nodemailer = require('nodemailer'); const cors = require('cors'); const bodyParser = require('body-parser'); const app = express(); const PORT = process.env.PORT || 3000; // Dane do konta const emailConfig = { host: '', // Serwer SMTP port: 587, // Port: 465 dla SSL lub 587 dla TLS secure: false, // Ustaw na true, jeśli używasz portu 465 auth: { ...

[HTML|CSS] Jak umieścić tekst obok obrazka?

Aby umieścić tekst obok obrazka można posłużyć się tzw. "kontenerem elastycznym". W tym celu tworzymy element `div` z właściwością display: flex , co pozwoli na układanie elementów w poziomie lub w pionie. Przykład Kod CSS: .container { display: flex; align-items: center; } Kod HTML: <div class="container"> <img src="logo.png" alt="Logo" /> <span>Lorem</span> </div> Powyższy kod wyświetli element `span` z prawej strony elementu `img`. W powyższym przykładzie użyta została również właściwość align-items: center , co spowoduje wyrównanie tekstu w pionie.

[HTML|CSS] Jak zrobić ładny formularz HTML?

Drogi do ładnego formularza HTML są dwie - ostylujemy formularz sami, albo skorzystamy z bibliotek takich jak np. Bootstrap. W tym wpisie stworzymy przykładowy formularz zarówno z własnym stylem, jak i z użyciem Bootstrapa. Na potrzeby tego wpisu załóżmy, że chcemy stworzyć formularz kontaktowy. Własny styl formularza Najpierw tworzymy formularz: <div class="container"> <form> <div class="form-group"> <label for="name">Imię:</label> <input type="text" id="name" name="name" placeholder="Wpisz swoje imię" required> </div> <div class="form-group"> <label for="email">Email:</label> <input type="email" id="email" name="email" placeholder="Wpisz swój email" required> </div> <div class="form-...

[Python] Jak wysłać SMS z poziomu Pythona bez użycia bramki?

Czy da się wysyłać SMS'y z poziomu Pythona bez konieczności korzystania z płatnych bramek? Oczywiście, że tak. Potrzebny do tego będzie Modem GSM z aktywną kartą SIM oraz biblioteka pySerial do komunikacji z modemem. Przykład W poniższym przykładzie program po uruchomieniu będzie oczekiwał na podanie numeru odbiorcy, a następnie podanie treści wiadomości SMS, po której podaniu zostanie ona wysłana. Pamiętaj, aby w modem_port podać poprawny port, gdzie podłączony jest modem. import serial import time # Ustawienia portu szeregowego modem_port = '/dev/ttyUSB0' # Port USB z modemem baud_rate = 9600 def get_network_name(port): try: with serial.Serial(port, baud_rate, timeout=5) as modem: time.sleep(1) # Inicjalizacja modem.write(b'AT\r') time.sleep(1) print(modem.read_all().decode()) # Odczytanie odpowiedzi # Sprawdzenie operatora modem.write(b'AT+COPS?\r')...

[HTML|PHP] Jak wyłączyć stronę (strona w budowie)

W tym wpisie dowiesz się jak szybko wyłączyć stronę za pomocą PHP na potrzeby np. aktualizacji lub z innego powodu. Kod PHP Zakładając, że plik .htaccess kieruje wszystkie żądania do pliku index.php , wystarczy dołączyć do niego plik z funkcją, która będzie ładować odpowiedni szablon oraz wyłączać dalsze wykonywanie kodu. Kod PHP Tworzymy funkcję website_off , której zadaniem będzie sprawdzenie czy plik website-off.html istnieje i jeśli tak, wczytanie go, wyświetlenie zawartości oraz zatrzymanie wykonywania dalszego kodu. Plik website-off.html to plik szablonu alternatywnej strony, która ma być wyświetlana, gdy chcemy wyłączyć właściwą stronę. <?php function website_off() { if(file_exists('website-off.html')) { echo file_get_contents('website-off.html'); exit; } } website_off(); Powyższą funkcję tworzymy np. w pliku website-off.php i dołączamy go na początku pliku index.php . Od teraz, aby wyłączyć stron...

[jQuery Mobile] Okienko dialogowe

Tworzenie ładnego okienka dialogowego przy użyciu jQuery Mobile zajmuje dosłownie kilka linii kodu HTML. Przykład <div data-role="popup" id="dialog" data-overlay-theme="b" data-theme="a" class="ui-content"> <h3>Komunikat</h3> <p>Przykładowa zawartość okienka dialogowego.</p> <a href="#" class="ui-btn ui-btn-inline" data-rel="back">Zamknij</a> </div> <div role="main" class="ui-content"> <a href="#dialog" class="ui-btn ui-btn-inline" data-rel="popup">Otwórz okienko</a> </div>

[JavaScript] Odliczanie

W tym wpisie stworzymy prosty licznik odliczający od podanej wartości. Kod HTML Zacznijmy od utworzenia kontenera dla licznika: <div class="counter-container"> <div id="counter" class="counter">100</div> </div> Kod CSS Utwórzmy jakieś efekty animowane dla licznika: .counter { font-size: 100px; transition: transform 0.3s ease, color 0.3s ease; } .fade { opacity: 0; transition: opacity 0.3s ease; } .bounce { animation: bounce 0.3s ease; } @keyframes bounce { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } Kod JavaScript document.addEventListener('DOMContentLoaded', () => { const startNumber = 100; // Odliczamy od const countdownSpeed = 500; // Prędkość odliczania (w milisekundach) const counterElement = document.getElementById(...